1 / 36

User Interfaces in the Mobile Industry

User Interfaces in the Mobile Industry. November 2011. OpenPlug key facts. Founded in 2002 France (Sophia-Antipolis) ~ 50 people Acquired by Alcatel-Lucent in March 2011 OpenPlug provides the first open software framework for mass market wireless phones. OpenPlug key facts.

quinlan-brooks
Download Presentation

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 November 2011

  2. OpenPlug key facts • Founded in 2002 • France (Sophia-Antipolis) • ~ 50 people • Acquired by Alcatel-Lucent in March 2011 OpenPlug provides the first open software framework for mass market wireless phones Open-Plug Confidential & Proprietary

  3. OpenPlug 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. A few 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. A few 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. A few 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 Android Windows Phone 7 Nokia Maemo, 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 (beta versions in 2011) • 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. Smartphone/Tablet specifications • Processor: ARM10 ~600MHz to ARM11 ~1200MHz • RAM: 128MB to 512MB • Screen: 16bits, 320*480, 480*800, 1280*800 24 24 Open-Plug Confidential & Proprietary Open-Plug Confidential & Proprietary Open-Plug Confidential & Proprietary

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

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

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

  28. 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 28 Open-Plug Confidential & Proprietary

  29. 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 29 Open-Plug Confidential & Proprietary

  30. Tutorial 30 Open-Plug Confidential & Proprietary

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

  32. Join the OpenPlug Studio Developer Program Go to http://developer.openplug.com It’s free for all, just enroll ! Download OpenPlug Studio 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 !

  33. Thank you! Open-Plug Confidential & Proprietary

  34. Internships Open-Plug Confidential & Proprietary

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

  36. 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 36 Open-Plug Confidential & Proprietary 36 Open-Plug Confidential & Proprietary

More Related