Writing Storyboards

1,976 views

Published on

1st KT Econovation Open Conference
2nd Session Presentation

Published in: Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,976
On SlideShare
0
From Embeds
0
Number of Embeds
322
Actions
Shares
0
Downloads
1
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide


























































































































  • Writing Storyboards

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

    ×