1 / 35

User Interfaces in the Mobile Industry

User Interfaces in the Mobile Industry. October 2010. Open-Plug key facts. Founded in 2002 France (Sophia-Antipolis), Romania (Bucharest), Taiwan (Taipei) ~ 50 people Open-Plug provides the first open software framework for mass market wireless phones. Open-Plug key facts.

aleda
Télécharger la présentation

User Interfaces in the Mobile Industry

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. User Interfaces in the Mobile Industry October 2010

  2. Open-Plug key facts • Founded in 2002 • France (Sophia-Antipolis), Romania (Bucharest), Taiwan (Taipei) • ~ 50 people Open-Plug provides the first open software framework for mass market wireless phones Open-Plug Confidential & Proprietary

  3. Open-Plug key facts Mobile industry veterans Experts in embedded software for mobile phones H.Q. based in Sophia Antipolis, the French ‘telecom valley’ Experts in mobile software development environments 3 Open-Plug Confidential & Proprietary

  4. Introduction and background Open-Plug Confidential & Proprietary

  5. User Interface • What is a User Interface ? • Display things • Receive inputs Open-Plug Confidential & Proprietary

  6. Example of GTK, but itapplies to all Send events To widget tree Window Gmain loop control point toolbar List Syst Events (keypad,...) Btn right Btn mid Btn left Process events From widget tree Widget Tree Drawing engine (GDK/DFB/nCore) Services (Databases,…) 6 Open-Plug Confidential & Proprietary Open-Plug Confidential & Proprietary

  7. Notion of states State 2 State 3 State 1 7 Open-Plug Confidential & Proprietary Open-Plug Confidential & Proprietary

  8. Actors definition Tech Expertize Artistic Talent • Graphical Designer • Creates Graphical Assets « what the screens look like » • Transitions and animations • Interaction Designer • Defines Screens and UI Flow • High level application logic • Defines UI Data to be presented • Screen Layouts • Software Engineer • Connects data services to middleware. • Integrates application logic with middleware and events Different actors, different knowledge …. So different technologies and different tools! 8 Open-Plug Confidential & Proprietary Open-Plug Confidential & Proprietary

  9. 2 years ago… • UI is designed by Graphic Designers on paper, and put in place by Engineers. • UI is developed in C/C++/Java, using GTK, QT, or proprietary technologies. • Result is often not exactly what designer wanted. OK OK Open-Plug Confidential & Proprietary

  10. 2 years ago… • On the Customer side: • Software is not important • People only look at the hardware design • People don’t buy a phone because UI is pretty Open-Plug Confidential & Proprietary

  11. 2 years ago… • On the Phone Makers side: • Operators focus on functionality instead of ergonomics • No code reuse between platforms, lot of time is lost rewriting the UI for each phone • Screen size adaptation means rewriting the UI (engineers) Open-Plug Confidential & Proprietary

  12. The turn-over Open-Plug Confidential & Proprietary

  13. Change of mind • New handset comes out • UI is pretty and easy to use • Many features are missing (MMS…)  But it is a success ! Open-Plug Confidential & Proprietary

  14. Change of mind • People realize that software is important • Phone companies wants beautiful UIs, quickly • UI shouldn’t be developed by engineers, but by graphic designers • Graphic Designers should be free to do what they want, and not limited by technology Open-Plug Confidential & Proprietary

  15. What industry wants • Sexy mobile phones with beautiful UI • Create new variants of a mobile phone easily • Let graphic designers handle the UI Open-Plug Confidential & Proprietary

  16. NextGen UI Open-Plug Confidential & Proprietary

  17. UI technologies are trendy on phones…. iPhone Samsung Player HTC Touch Flash Phones (LG Prada) etc… Open-Plug Confidential & Proprietary Open-Plug Confidential & Proprietary

  18. UI technolgies are trendy on the web and desktop 18 Open-Plug Confidential & Proprietary Open-Plug Confidential & Proprietary

  19. Next Gen UI • New UI technologies focus on : • Productivity • Easy access for designers • Reusability • Componentization (widgets) Open-Plug Confidential & Proprietary

  20. Adobe Flex • What is Flex ? • UI technology from Adobe • One of the most productive Framework of the industry (10 times more productive than Flash, as said by Adobe) • Framework and tools to build dynamic, interactive rich Internet applications delivered on the web (Flash Player) or to the desktop (Adobe AIR) • Very popular in web and desktop environments: • Google • Volkswagen • Oracle • HP • eBay • Leverages Adobe tools penetration with graphics/designers Open-Plug Confidential & Proprietary

  21. Adobe Flex Builder 21 Open-Plug Confidential & Proprietary Open-Plug Confidential & Proprietary

  22. Adobe Flex on mobile phones ? • Adobe Flex can bring a lot to Mobile Phones • In term of productivity • In term of graphical standard • But • Flex requires a Flash 10 or AIR runtime • Not yet available for mobile phone (announced 2010) • Flash/AIR runtime faces performance/memory constraints on mid- and low- end platforms • No standard industrial flow is defined between all actors in the mobile phone product lifecycle • Flex suits only single application design and not complex system design 22 Open-Plug Confidential & Proprietary Open-Plug Confidential & Proprietary

  23. Mass market phone specifications • Processor: ARM7 ~100MHz to ARM9 ~200MHz • RAM: 1MB to 4MB • Flash: 4MB to 16MB • Screen: 16bits, 176*220 to 240*320 23 Open-Plug Confidential & Proprietary Open-Plug Confidential & Proprietary

  24. NextGen UI on platform 24 Open-Plug Confidential & Proprietary Open-Plug Confidential & Proprietary

  25. What does Open-Plug offer ? ELIPS Studio 3 The next generation of development environment for mobile applications You are a Flex developer ? Now you are a mobile expert ! 25 Open-Plug Confidential & Proprietary

  26. Open-Plug Solution • Open-Plug ELIPS 3.0 • ELIPS 3.0 reuses Adobe tools • ELIPS 3.0 allows to transform scripted Flex applications into native code • ELIPS 3.0 allows Designers to be in charge of UI, not Engineers • ELIPS 3.0 makes a clear separation of Presentation from Logic and Data • Model-View-Controller pattern • ELIPS 3.0 relies on OP’s commercical-grade graphics rendering engine • Excellent performance on feature phone platforms, even low-end • Advanced features • Touchscreen support • Transition effects • ELIPS 3.0 can be introduced easily on an existing platform • Thanks to OP Companion Framework Open-Plug Confidential & Proprietary

  27. Flex is your new mobile SDK Code your application in Flex Builder with our mobile Flex SDK Test it in our phone simulator Build it natively and deploy it on today’s handsets 27 Open-Plug Confidential & Proprietary

  28. How do we do this ? • Flex Framework internal AS code has been optimised • Unique build technology “transcodes” AS3/MXML into native code • Application is executed natively on the “bare metal” • Compact and efficient execution libraries are packaged in the app assets AS3 YOUR APP CODE MXML 010101010101010 ELIPS COMPILER ELIPS MOBILE FLEX SDK 28 Open-Plug Confidential & Proprietary

  29. Tutorial 29 Open-Plug Confidential & Proprietary

  30. Tutorial Step 1: Setup Install Adobe Flex Builder Install Open-Plug ELIPS Studio 3 Setup Flex Builder’s Workspace Step 2: Flickr Application Create AIR app Simulate on PC Step 3: Bring to device Build for Windows Mobile or Android Run on device 30 Open-Plug Confidential & Proprietary

  31. Join the ELIPS Studio 3 Developer Program Go to http://www.open-plug.com/developers It’s free for students, just enroll ! Download ELIPS Studio 3 and be the first to make Flex applications for mobiles Learn more through videos and samples Share your experiences with our experts and other users on our Forum Influence the commercial product spec And enjoy the mobile world !

  32. Thank you! Open-Plug Confidential & Proprietary

  33. Internships Open-Plug Confidential & Proprietary

  34. Open-Plug Internships • Open-Plug recruits interns! • Design User Interfaces • Write JavaScript applications • Optimize drawing algorithms • Develop MXML to C++ compiler • Adapt graphic stack for new devices (Android, iPhone) Open-Plug Confidential & Proprietary

  35. ELIPS 3.0 Actors and Flow -Connect data services to middleware. -Integrate application logic with middleware and events -Define Screens and UI Flow -High level application logic -Define UI Data to be presented -Screen Layouts -Transition and animations Adobe Flex Builder Visual Studio -Graphical assets creation Adobe CS3 Photoshop / Illustrator 35 Open-Plug Confidential & Proprietary 35 Open-Plug Confidential & Proprietary

More Related