[Msd10]mobile design02

456 views

Published on

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
456
On SlideShare
0
From Embeds
0
Number of Embeds
180
Actions
Shares
0
Downloads
5
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

[Msd10]mobile design02

  1. 1. http://msd2013.jylee6977.com/tcKGIT 2013 SPRING CLASS @ JYLEEMobileServiceDesign
  2. 2. MobileServiceDesignhttp://msd2013.jylee6977.com/tcApp Design Process(after service strategy)IDEA WIREFRAME DESIGNINGInformation Architecture(IA)  User Interface Design(UI)  Graphic User Interface Design(GUI)  Sourcing(XML)
  3. 3. MobileServiceDesignhttp://msd2013.jylee6977.com/tcApp Design Process(after service strategy)Information Architecture(IA)  User Interface Design(UI)  Graphic User Interface Design(GUI)  Sourcing(XML)
  4. 4. MobileServiceDesign0. Systemizing InformationsSitemap
  5. 5. http://msd2013.jylee6977.com/tc
  6. 6. MobileServiceDesign1. Converting Information to ScreenUser Interface Basics
  7. 7. MobileServiceDesignhttp://msd2013.jylee6977.com/tcNatureCultureSocietyHuman
  8. 8. MobileServiceDesignhttp://msd2013.jylee6977.com/tcNatureCultureCyberSocietyHuman
  9. 9. MobileServiceDesignhttp://msd2013.jylee6977.com/tcCyberInterface : Human Cyber ( )
  10. 10. MobileServiceDesignhttp://msd2013.jylee6977.com/tcAn interface is a point of interactionbetween two systems or work groups. Inthe manufacturing environment, theinteraction and coordination between anumber of work groups communicateplans and control production activity.
  11. 11. MobileServiceDesignhttp://msd2013.jylee6977.com/tc
  12. 12. MobileServiceDesignhttp://msd2013.jylee6977.com/tc++세 분야간 긴밀한 작업 필요
  13. 13. MobileServiceDesignhttp://msd2013.jylee6977.com/tc
  14. 14. MobileServiceDesignhttp://msd2013.jylee6977.com/tc필수적인 요소를 제공하는 최소한의 레벨 : 유용성논리적인 설계 : 사용성, 편의성일관성, 흥미로운 설계 : 심미성
  15. 15. MobileServiceDesignhttp://msd2013.jylee6977.com/tc
  16. 16. MobileServiceDesignhttp://msd2013.jylee6977.com/tc
  17. 17. MobileServiceDesignhttp://msd2013.jylee6977.com/tc
  18. 18. MobileServiceDesignhttp://msd2013.jylee6977.com/tc
  19. 19. MobileServiceDesignhttp://msd2013.jylee6977.com/tc
  20. 20. MobileServiceDesignhttp://msd2013.jylee6977.com/tc–Navigation bar Action barMulti-pane layouts Selection
  21. 21. MobileServiceDesignhttp://msd2013.jylee6977.com/tcTouchPress, LiftLong PressPress, Wait, LiftSwipePress, Move, LiftDragLong press, Move,LiftDouble Touch Pinch Open/Close
  22. 22. MobileServiceDesignhttp://msd2013.jylee6977.com/tcTop Level ViewCategory ViewDetail/Edit ViewTop Level ViewCategory ViewDetail/Edit View
  23. 23. MobileServiceDesignhttp://msd2013.jylee6977.com/tcPut content forwardSet up action bars fornavigation and actionsCreate an identity for your app
  24. 24. MobileServiceDesignhttp://msd2013.jylee6977.com/tcUse tabs to combine category selection and data display
  25. 25. MobileServiceDesignhttp://msd2013.jylee6977.com/tcAllow cutting throughhierarchies
  26. 26. MobileServiceDesignhttp://msd2013.jylee6977.com/tcLayout : View + Action Lights-out mode
  27. 27. MobileServiceDesignhttp://msd2013.jylee6977.com/tcMake navigation between detail views efficient
  28. 28. MobileServiceDesignhttp://msd2013.jylee6977.com/tcUPback
  29. 29. MobileServiceDesignhttp://msd2013.jylee6977.com/tcApp Icon View Control Action Button Action Overflow
  30. 30. MobileServiceDesignhttp://msd2013.jylee6977.com/tcMain Action BarTop BarBottom Bar
  31. 31. MobileServiceDesignhttp://msd2013.jylee6977.com/tcMain Action BarTop BarBottom Bar
  32. 32. MobileServiceDesignhttp://msd2013.jylee6977.com/tcTabSpinnersDrawers
  33. 33. MobileServiceDesignhttp://msd2013.jylee6977.com/tcF — FrequentWill people use this action at least 7 out of 10 times they visit the screen?Will they typically use it several times in a row?Would taking an extra step every time truly be burdensome?I — ImportantDo you want everyone to discover this action because its especially cool or a sellingpoint?Is it something that needs to be effortless in the rare cases its needed?T — TypicalIs it typically presented as a first-class action in similar apps?Given the context, would people be surprised if it were buried in the action overflow?
  34. 34. MobileServiceDesignhttp://msd2013.jylee6977.com/tc
  35. 35. MobileServiceDesignhttp://msd2013.jylee6977.com/tc
  36. 36. MobileServiceDesignhttp://msd2013.jylee6977.com/tc
  37. 37. MobileServiceDesignhttp://msd2013.jylee6977.com/tc
  38. 38. MobileServiceDesignhttp://msd2013.jylee6977.com/tc
  39. 39. MobileServiceDesignhttp://msd2013.jylee6977.com/tc
  40. 40. MobileServiceDesign2. Schematic Your User InterfacesWireframe
  41. 41. MobileServiceDesignhttp://msd2013.jylee6977.com/tc
  42. 42. MobileServiceDesignhttp://msd2013.jylee6977.com/tc
  43. 43. MobileServiceDesignhttp://msd2013.jylee6977.com/tcProto : only 5 proto free | Interactive Moqups : Iphone (Non- Interactive) UXPin : 30days Free | InteractiveBalsamiq : Download App Justinmind : Download App | Interactive Fluid : Interactive Free
  44. 44. MobileServiceDesignhttp://msd2013.jylee6977.com/tcAxure : Download App | Interactive High Mockflow : 5pages free | Interactive Protoshare : Fee IncludedWireframe : So simple Wireframe Sketcher : Download Pidoco : Fast and Interactive
  45. 45. MobileServiceDesignhttp://msd2013.jylee6977.com/tcInvision : Share Your Prototype Mock.me (simplest to check) iPLOTZ : Share your projectPencils : Download GUI
  46. 46. MobileServiceDesignFOR NEXT WEEK1. SCENARIO2. SELECT KEY IDEA & IA PATTERN3. PAPER PROTOTYPE4. SITEMAP (LIST OF FUNCTIONS&SPECS)5. UI WIREFRAME

×