1st KT Econovation Open Conference 2nd Session Presentation

1. Writing Storyboards
Jay Cho at Waplestore Inc.

2. ?

4. 2 Developers

5. 2 Developers
1 Designer

6. 2 Developers
1 Designer
No Planners

8. 3 Developers

9. 3 Developers
2 Designers

10. 3 Developers
2 Designers
No Planners

11. Therefore,

12. No Storyboards
in traditional meaning

13. T^T

14. Instead,

16. Share how weʼre doing,

17. Share how weʼre doing,
Answer your questions!

18. 1. Storyboard?

19. Before we get started...

21. Great Ideas?

22. Great Ideas?
Top Secrets?

23. Great Ideas?
Top Secrets?
Well...

24. No Great Ideas,
Without Executions!

25. First-step of Execution is,
Storyboard!

26. Prejudices
of storyboard

28. Itʼs formal!
It should be thick PPT-typed Documents

29. Itʼs formal!
It should be thick PPT-typed Documents
Itʼs not my job!
It was usually plannerʼs

30. Yes, but...

32. Great Tools
to organize your own ideas

33. Great Tools
to organize your own ideas
Wonderful Methods
to share the ideas in your head with others

34. 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

35. in traditional Meanings

36. Yes, but...

38. In App Development,

39. In App Development,
UI & Logic are tightly coupled

40. In App Development,
UI & Logic are tightly coupled
API & Resource are limited

41. Case Study : SmartDialer™

43. Keypad Based
Contacts Search Application

44. Keypad Based
Contacts Search Application
✓ Our First Project
✓ Designer-driven Process
✓ Take 3 weeks for Development

45. 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

46. 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

47. Use System API
Use Default UI
Make Custom Controller

48. Use System API
cause of changing our plan
Use Default UI
Make Custom Controller

49. Use System API
cause of changing our plan
Use Default UI
cause of changing our design
Make Custom Controller

50. 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

51. Thus,
you better help plannerʼs job!

52. 2. Storyboard Tools

53. Traditional PPT

54. Traditional PPT
Some Images
Descriptions

55. Photoshop UI Kit

56. Hand Drawing Tools
http://www.uistencils.com/products/iphone-stencil-kit

57. Mind Map

58. Wiki

59. And,
anything you feel free to use!

60. 3. Writing Storyboard

61. Idea

62. Write
Idea
Requirements

63. Write Adjust & Fix
Idea
Requirements Requirements

64. Group
Write Adjust & Fix
Idea Requirements
Requirements Requirements
by Views

65. Group
Write Adjust & Fix
Idea Requirements
Requirements Requirements
by Views
Draw
Main View

66. Group
Write Adjust & Fix
Idea Requirements
Requirements Requirements
by Views
Put
Draw
Sub Views
Main View
(Flowchart)

67. Group
Write Adjust & Fix
Idea Requirements
Requirements Requirements
by Views
Put
Draw Draw
Sub Views
Main View Sub Views
(Flowchart)

68. Group
Write Adjust & Fix
Idea Requirements
Requirements Requirements
by Views
Put
Draw Draw
Sub Views Storyboard
Main View Sub Views
(Flowchart) Done!

69. Group
Write Adjust & Fix
Idea Requirements
Requirements Requirements
by Views
Put
Draw Draw
Sub Views Storyboard
Main View Sub Views
(Flowchart) Done!

70. Case Study : SmartTimer™

71. Timer Application
For Effective Conference
✓ Role based Project
✓ Take 2 weeks for Development

72. Idea

73. Write Requirements

74. Write Requirements
• Choose Timer As Simple As Possible

75. Write Requirements
• Choose Timer As Simple As Possible
• Divide Time by 80:20 rule and Alert

76. Write Requirements
• Choose Timer As Simple As Possible
• Divide Time by 80:20 rule and Alert
• Display Remain Time

77. Write Requirements
• Choose Timer As Simple As Possible
• Divide Time by 80:20 rule and Alert
• Display Remain Time
• Display Progressive Bar

78. 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

79. 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

80. 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

81. 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

82. 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

83. 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

84. 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

85. 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

86. 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

87. Draw Main View

88. Put Sub Views
Player View
Settings View
Timer View

89. Draw Sub Views

90. 4. Choose Your Own

91. Solo?

92. Smallest is good for you!
Just note is enough,
but you may try Mind Map or Wiki for later.

93. Team?

94. 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.

95. Case Study : Waplestore Inc.

96. The Point is,
finding your own way is most
important for your storyboard!

97. Remember This!

98. Storyboard is the best tool
to organize ideas
to share this with others
to reduce your mistakes!

99. You should write a storyboard
to imagine the whole details
of your application

100. Try to find your own ways,
and try it to fit with your team!

101. Questions?

102. More Questions?

103. Visit Our Website
http://www.waplestore.com
Drop a mail to us
support@waplestore.com
Follow our twitter
@waplestore

104. Or,
Just visit our office anytime!
for
YOU!

105. Thank you!
WE HOPE TO SEE YOU AGAIN :)