PROJECTS
Web & Native App Communication Program
Samsung Software Membership
Web & Native App Communication Program
Samsung Software Membership
Summary
- Product name: Tile Platform + Mosaic System (STILER / STILERS).
- Goal: Real-time, cross-platform text editing so multiple users can edit the same document at once (like Google Docs), with a simpler flow than existing note apps.
- Concept: Text blocks = “Tiles”; a document = “Mosaic”. Auto-documentation algorithm arranges Tiles into documents. Quick start via beacon so you can join a “room” by proximity.
- Platforms: Windows (WPF), macOS, Android, iOS. Beacon (e.g. RECO) used to auto-suggest room by location.
- Tech: Operational Transformation (OT) for conflict-free concurrent editing, MVC, Node.js (ShareJS), Cocoa, .NET/WPF, Cordova.
Project duration and schedule
- Duration: 2015.07.18 – 2015.12.15
- Kick-off: 2015.07.18
- Mid-term: 2015.10.20
- Completion: 2015.12.10
- Final submission: 2015.12.15
Development environment
- OS: Windows 7, Ubuntu 14.04, Mac OS
- Tools: Eclipse, Android Studio, Coda2, Visual Studio
- Languages: Java, JavaScript, C++, HTML, CSS3, XML
- Frameworks: Cocoa (Xcode), .NET (WPF), Cordova
Architecture
System

Software

Tile

Goals (weighted)
| Goal | Weight |
|---|---|
| Cross-platform Tile (Desktop + Mobile) | 20 |
| Mosaic algorithm error-free | 20 |
| Real-time async (OT, data integrity) | 20 |
| Open-source and developer ecosystem | 30 |
| New UX/UI | 5 |
| Practical service | 5 |
Background (short)
- Many note apps (OneNote, Evernote, etc.) have heavy UIs and long flows to start writing.
- This project: minimal UI, instant notepad, real-time co-editing across platforms, optional auto-documentation (Mosaic). Rooms for shared editing; beacons to suggest room by location.
Tech in brief
- Operational Transformation (OT): Keeps concurrent edits consistent (e.g. ShareJS on Node.js).
- Cross-platform: Same app concept on Windows, Mac, Android, iOS; native where it matters.
- MVC: Model (data/logic), View (I/O), Controller (flow).
- WPF: XAML + .NET for Windows desktop UI.
Development content (by platform)
Mac OS X
- Login/sign-up, terms agreement, welcome screen. App can sit in the menu bar for quick start.
- “Start” opens a notepad; “#” = room ID. Enter room number + “Go” to co-edit with others in that room.
- Room management and permissions. UI aligned with Android/iOS for consistency.

Windows WPF

- STILERS launch screen and desktop app entry.
Android & iOS
- Same flow: logo, sign-up with terms, login, main activity. Quick notepad, room join, tile list.
- List view with “Quick Address ID,” “Remove from List,” “Options.” Flip-style UI for tile list.

Beacon
- RECO beacon: device measures RSSI; when close, app suggests the room for that space (e.g. meeting room). Far from beacon = normal app; near beacon = room number / doc management offered.

Glossary
| Term | Description |
|---|---|
| WPF | Windows Presentation Foundation; DirectX and XAML UI. |
| Cross-platform | Same app runs on multiple OSes. |
| OT | Operational Transformation; syncs concurrent edits. |
| Cordova | JavaScript/HTML/CSS apps with access to device APIs. |
References
- pyrasis.com – Using Node.js
- “Apache Core Guide” by Ben Laurie, Peter Laurie