Writing Storyboards

  • 1,557 views
Uploaded on

1st KT Econovation Open Conference …

1st KT Econovation Open Conference
2nd Session Presentation

More in: Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
1,557
On Slideshare
0
From Embeds
0
Number of Embeds
2

Actions

Shares
Downloads
1
Comments
0
Likes
1

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide


























































































































Transcript

  • 1. Writing Storyboards Jay Cho at Waplestore Inc.
  • 2. ?
  • 3. 2 Developers
  • 4. 2 Developers 1 Designer
  • 5. 2 Developers 1 Designer No Planners
  • 6. 3 Developers
  • 7. 3 Developers 2 Designers
  • 8. 3 Developers 2 Designers No Planners
  • 9. Therefore,
  • 10. No Storyboards in traditional meaning
  • 11. T^T
  • 12. Instead,
  • 13. Share how weʼre doing,
  • 14. Share how weʼre doing, Answer your questions!
  • 15. 1. Storyboard?
  • 16. Before we get started...
  • 17. Great Ideas?
  • 18. Great Ideas? Top Secrets?
  • 19. Great Ideas? Top Secrets? Well...
  • 20. No Great Ideas, Without Executions!
  • 21. First-step of Execution is, Storyboard!
  • 22. Prejudices of storyboard
  • 23. Itʼs formal! It should be thick PPT-typed Documents
  • 24. Itʼs formal! It should be thick PPT-typed Documents Itʼs not my job! It was usually plannerʼs
  • 25. Yes, but...
  • 26. Great Tools to organize your own ideas
  • 27. Great Tools to organize your own ideas Wonderful Methods to share the ideas in your head with others
  • 28. Great Tools to organize your own ideas Wonderful Methods to share the ideas in your head with others Perfect Pre-Designs to reduce logical mistakes on development time
  • 29. in traditional Meanings
  • 30. Yes, but...
  • 31. In App Development,
  • 32. In App Development, UI & Logic are tightly coupled
  • 33. In App Development, UI & Logic are tightly coupled API & Resource are limited
  • 34. Case Study : SmartDialer™
  • 35. Keypad Based Contacts Search Application
  • 36. Keypad Based Contacts Search Application ✓ Our First Project ✓ Designer-driven Process ✓ Take 3 weeks for Development
  • 37. Keypad Based Contacts Search Application ✓ Our First Project ✓ Designer-driven Process ✓ Take 3 weeks for Development ✓ Use System API : Phone Call, SMS Send ✓ Use Default UI : ABAddressBookUI ✓ Make Custom Designed TabBar Controller
  • 38. Keypad Based Contacts Search Application ✓ Our First Project ✓ Designer-driven Process Cause of Problems! ✓ Take 3 weeks for Development ✓ Use System API : Phone Call, SMS Send ✓ Use Default UI : ABAddressBookUI ✓ Make Custom Designed TabBar Controller
  • 39. Use System API Use Default UI Make Custom Controller
  • 40. Use System API cause of changing our plan Use Default UI Make Custom Controller
  • 41. Use System API cause of changing our plan Use Default UI cause of changing our design Make Custom Controller
  • 42. Use System API cause of changing our plan Use Default UI cause of changing our design Make Custom Controller cause of taking more time to develop
  • 43. Thus, you better help plannerʼs job!
  • 44. 2. Storyboard Tools
  • 45. Traditional PPT
  • 46. Traditional PPT Some Images Descriptions
  • 47. Photoshop UI Kit
  • 48. Hand Drawing Tools http://www.uistencils.com/products/iphone-stencil-kit
  • 49. Mind Map
  • 50. Wiki
  • 51. And, anything you feel free to use!
  • 52. 3. Writing Storyboard
  • 53. Idea
  • 54. Write Idea Requirements
  • 55. Write Adjust & Fix Idea Requirements Requirements
  • 56. Group Write Adjust & Fix Idea Requirements Requirements Requirements by Views
  • 57. Group Write Adjust & Fix Idea Requirements Requirements Requirements by Views Draw Main View
  • 58. Group Write Adjust & Fix Idea Requirements Requirements Requirements by Views Put Draw Sub Views Main View (Flowchart)
  • 59. Group Write Adjust & Fix Idea Requirements Requirements Requirements by Views Put Draw Draw Sub Views Main View Sub Views (Flowchart)
  • 60. Group Write Adjust & Fix Idea Requirements Requirements Requirements by Views Put Draw Draw Sub Views Storyboard Main View Sub Views (Flowchart) Done!
  • 61. Group Write Adjust & Fix Idea Requirements Requirements Requirements by Views Put Draw Draw Sub Views Storyboard Main View Sub Views (Flowchart) Done!
  • 62. Case Study : SmartTimer™
  • 63. Timer Application For Effective Conference ✓ Role based Project ✓ Take 2 weeks for Development
  • 64. Idea
  • 65. Write Requirements
  • 66. Write Requirements • Choose Timer As Simple As Possible
  • 67. Write Requirements • Choose Timer As Simple As Possible • Divide Time by 80:20 rule and Alert
  • 68. Write Requirements • Choose Timer As Simple As Possible • Divide Time by 80:20 rule and Alert • Display Remain Time
  • 69. Write Requirements • Choose Timer As Simple As Possible • Divide Time by 80:20 rule and Alert • Display Remain Time • Display Progressive Bar
  • 70. Write Requirements • Choose Timer As Simple As Possible • Divide Time by 80:20 rule and Alert • Display Remain Time • Display Progressive Bar • Record Voice & Movie
  • 71. Write Requirements • Choose Timer As Simple As Possible • Divide Time by 80:20 rule and Alert • Display Remain Time • Display Progressive Bar • Record Voice & Movie • Play Recorded Voice File
  • 72. Write Requirements • Choose Timer As Simple As Possible • Divide Time by 80:20 rule and Alert • Display Remain Time • Display Progressive Bar • Record Voice & Movie • Play Recorded Voice File • Send Recorded Voice File via Email
  • 73. Write Requirements • Choose Timer As Simple As Possible • Divide Time by 80:20 rule and Alert • Display Remain Time • Display Progressive Bar • Record Voice & Movie • Play Recorded Voice File • Send Recorded Voice File via Email • Changeable Alert Sound
  • 74. Write Requirements • Choose Timer As Simple As Possible • Divide Time by 80:20 rule and Alert • Display Remain Time • Display Progressive Bar • Record Voice & Movie • Play Recorded Voice File • Send Recorded Voice File via Email • Changeable Alert Sound • Changeable Mic Gain
  • 75. Write Requirements • Choose Timer As Simple As Possible • Divide Time by 80:20 rule and Alert • Display Remain Time • Display Progressive Bar • Record Voice & Movie • Play Recorded Voice File • Send Recorded Voice File via Email • Changeable Alert Sound • Changeable Mic Gain • Changeable Record File Format
  • 76. Adjust & Fix Requirements • Choose Timer As Simple As Possible • Divide Time by 80:20 rule and Alert • Display Remain Time • Display Progressive Bar • Record Voice & Movie • Play Recorded Voice File • Send Recorded Voice File via Email • Changeable Alert Sound • Changeable Mic Gain • Changeable Record File Format
  • 77. Adjust & Fix Requirements • Choose Timer As Simple As Possible Use Default • Divide Time by 80:20 rule and Alert • Display Remain Time • Display Progressive Bar Make Custom • Record Voice & Movie Removed • Play Recorded Voice File Make Custom • Send Recorded Voice File via Email Use Default • Changeable Alert Sound • Changeable Mic Gain • Changeable Record File Format
  • 78. Group Requirements by Views • Main (Time Select) • Choose Timer As Simple As Possible • Timer View • Divide Time by 80:20 rule and Alert • Display Remain Time • Display Progressive Bar • Record Voice • Player View • Play Recorded Voice File • Send Recorded Voice File via Email • Settings View • Changeable Alert Sound • Changeable Mic Gain • Changeable Record File Format
  • 79. Draw Main View
  • 80. Put Sub Views Player View Settings View Timer View
  • 81. Draw Sub Views
  • 82. 4. Choose Your Own
  • 83. Solo?
  • 84. Smallest is good for you! Just note is enough, but you may try Mind Map or Wiki for later.
  • 85. Team?
  • 86. Focus on sharing, Find the best tool for your team! Try Wiki, Mind Map first. You may need traditional documents, especially when youʼre on out-sourced project.
  • 87. Case Study : Waplestore Inc.
  • 88. The Point is, finding your own way is most important for your storyboard!
  • 89. Remember This!
  • 90. Storyboard is the best tool to organize ideas to share this with others to reduce your mistakes!
  • 91. You should write a storyboard to imagine the whole details of your application
  • 92. Try to find your own ways, and try it to fit with your team!
  • 93. Questions?
  • 94. More Questions?
  • 95. Visit Our Website http://www.waplestore.com Drop a mail to us support@waplestore.com Follow our twitter @waplestore
  • 96. Or, Just visit our office anytime! for YOU!
  • 97. Thank you! WE HOPE TO SEE YOU AGAIN :)