In late 2015, Jamie received an email from a friend of a friend with an idea for a kid’s game. They were thousands of miles apart, had never met and had never built an app before. Just six months later they released Melody Jams, which went on to top the App Store charts in 130 countries with more than 500,000 downloads worldwide. It also received a Communication Arts 2017 Award of Excellence. Melody Jams is an allegory for the creative process. In essence, it’s a game teaching kids about empathy; to show how pieces can be more than the sum of their parts. In this talk, Jamie will lift the curtain on how that applies to design and technology: building culture on new teams, learning new languages and processes quickly, the value of prototyping and the eccentricities of the world of apps.

2. jamie@melodyjams.com
Twitter: @jkosoy | @PlayMelodyJams
Instagram: @melodyjams
#CAMPFEST17 #MelodyJams
Hi CAMP Festival! I’m Jamie!
9/12/2017

3. The Agenda!
• The Game
• How It All Began
• Our Team
• The Process
• Launch & Response
• What Happens Next?
• Takeaways

4. The Game

5. The Game
• Concept: A Swedish Wooden Block Toy
in App Form
• Audience: Hipster Parents
• Age Range: “Kids of All Ages”
• Optimize for “hand-me-down” devices
(older iPads)
• No instruction manual required
• Secret Mission: Teach social/emotional
learning.

6. Four Jams

7. The Garage
(which you’ve already seen)

8. The Big Show

9. Mars Disco

10. HolidayJams
Sold as a standalone app for the holidays.

11. How It All Began

12. Let’s talk a bit about me
#egomaniac #ilovetalkingaboutmyself

13. About Jamie!
• Dream growing up: Disney Imagineer
• BFA Multimedia, 2004
• Former Tech Director at fancy NYC
Agency Big Spaceship
• Professor at Parsons (MFA Design +
Technology), USFCA (BA Design)
• Now run my own shop, Arbitrary, just
south of San Francisco.

14. Translation!
• Made a lot of bad artwork.
• Made a lot of CD-ROMs.
• Made a lot of movie and TV show
web sites in Flash.
• Made designers learn how to code.
• Make a lot of apps, web sites, robotic
arms swinging sofas around, and so
on.

15. Yay, anxiety!
• Anxious about my future.
• Anxious about getting a job.
• Anxious about deadlines.
• Listen to other people’s anxieties.
• Anxious about everything.

16. I’m pretty high strung
and I like shiny things.
Lots of experience with people and design and code and anxiety.

17. 2015

18. Three cancelled projects
Negotiations on how far we go through the project,
no portfolio piece, tough on my finances…

19. Two projects with my older
brother as the client
Calling me up on the weekends,
business and family mixing…

21. Happy From
Beginning To End
(I talk to myself a lot.)

22. Then I got an email.

24. How many developers have
gotten this email before?
#allofus

25. But he mentioned a video link…

26. I knew I had to be a part of this.

27. Our Team

28. The Team
James Bartley
Concept
Creative Director, Animator, Illustrator
Jamie Kosoy
Tech Director
Marketing, UX, Anything App Related
Nate McKee
Music
Supporting cast: Matt Cook (project management), Georg Fischer (code), Hani Zahra (music)

29. Some challenges to overcome…

30. We had no money.

31. We had no experience making
anything for kids.

32. James, Nate and Hani had never made
anything interactive before. Ever.

33. Georg had never coded an iOS
app before.

34. I hadn’t coded one in over a year.

35. None of us had ever
met in real life.

37. The Process

39. Prototype Driven
Less talking. More making.

40. What is a Prototype?
A tangible artifact that explores an idea.

41. Rules To
A Prototype Driven Process

42. Create “Problem Statements”
Each statement represents a single task you can solve.
The more atomic, the better.
Rule #1

43. Start from something
you know how to do.
e.g. “How do I create a new file in Cinema4D?”
Start with easy prototypes.
Rule #2

44. Build Ugly
Comic Sans MS the shit out of it.
Rule #3

45. Keep The First Prototype(s) to
under 60 minutes.
If your prototypes are any more time consuming than that,
break them down further.
Rule #4

46. Prioritize by feeling,
not urgency.
Make whatever feels right to make.
Don’t worry about a deadline.
Rule #5

47. Fork.
Don’t overwrite a prototype.
Make a copy and extend from there.
Rule #6

48. Overshare.
Show off the shiny stuff you’re making with everyone.
Who knows what that inspires?
Rule #7

49. Document.
By now you have a Problem Statement and a Prototype.
What did you learn? Jot down a few bullet points and save it near your prototype.
Rule #8

50. Write Down Your Fears.
Turn Those Into Problem Statements.
Repeat.
Prototypes always unearth new things to learn and do.
Rinse and repeat the process.
Rule #9

51. Doesn’t matter the discipline.
Designers, artists, coders, whatever.
Everyone get started right away. No “blockers” allowed.

52. Example: Dragging Monsters
https://github.com/arbitraryco/melodyjams-prototypes

53. How do I create an iOS App?

54. How do I create an iOS Game?

55. How do I create a thing in the game?

56. How can I tap on that thing?

57. How do I drag that thing?

58. How can I have multiple dragging things?

59. How can I detect when one thing is near another thing?

60. 52 Dev Prototypes

61. Prototyping Assets for iOS
“What size do we design for if we’re
make an app that works on every iPad and iPhone?”

65. Prototyping animations
“What is the best way to export assets from After Effects?”

70. Prototyping the App Icon

73. And so on…

79. Prototyping The Music

80. Process Culture

82. The App was done byJanuary
3 months from James’ email to ready for the App Store. Including holidays.

83. We forgot to incorporate
It took until April to sort out our official company structure.

84. We told all our friends
We knew we had a hit. If only we could somehow get Apple’s attention…

85. Launch & Response

86. The Response
• Featured over 130 countries
• Featured in over 90 categories
• > 425,000 downloads
• USA Ranked #1 Kids App on iPad, #2
on iPhone
• Parents Choice, Tillywig Award
Winner

87. !
#1 Kids App. #31 Overall App*.
*as in ranked against everything Google, Tinder, Angry Birds, whatever.

96. More importantly…

100. Kenya

101. So we’re bazillionares, right?

102. Original Model
Free to download. $0.99 / Jam
Results: Lots of downloads, next to nothing in $$$.

104. New Model
$3.99 for Melody Jams. $1.99 for Holiday Jams
Results: Fewer downloads, about $10,000 in revenue.

105. Some Other Anecdotes

106. Customer Service

108. Two Lessons:
1. It isn’t my “job” to do it, but I did it anyway.
2. This is how you go from “I built an app” to “I built a thing people care about.”

109. Carousels

110. Launch Day

111. "❤❓

112. %!💔

113. Front Page

114. %
💀

115. Kids

116. Best. Placement.
Ever.

117. Morale of the Story
Never use carousels on a web site, app or anything.
Nobody ever swipes.

118. What Happens Next?

119. Doors Opening!
• Heard from a few TV networks about a Melody Jams show.
• Heard from several notable children’s companies about partnerships.
• Heard from a department store that wanted to make toys.

120. Chats with VCs

122. Personal Goal:
Mouse-Based Animation Studios

125. Takeaways

126. MelodyJams is all about
making things together.

127. One person by themselves can make something interesting.

128. But a group together can be more than the sum of their parts.

129. That can work for you, too.

130. Rules To A Prototype Driven Process
1. Create “Problem Statements.”
2. Start from something you know how to do.
3. Build Ugly.
4. Keep The First Prototype(s) to 60 minutes or less.
5. Prioritize by feeling, not by urgency.
6. Fork.
7. Overshare.
8. Document.
9. Write down your fears. Turn those into Problem Statements. Repeat.

131. Rules To Overcoming Anxiety
1. Write down what I fear.
2. Remind myself that this is something I know how to do.
3. Be myself.
4. Get a quick win.
5. Make stuff I want to make.
6. Fork.
7. Overshare.
8. Write down what made me happy.
9. Repeat.

132. Rules To Working With Others
1. Write down a plan.
2. Remind yourself that your colleagues & clients are intelligent, capable people.
3. Be honest with one another.
4. Cheerlead.
5. Take care of each other.
6. Fork.
7. Overshare.
8. Write down what made you happy.
9. Repeat.

133. Process Culture

135. Happy From
Beginning to End
#lifegoal #notjustme #youtoo #allofus #lovewhatyoudo

136. jamie@melodyjams.com
Twitter: @jkosoy | @PlayMelodyJams
Instagram: @melodyjams
Thanks!