{"id":9150,"date":"2013-08-01T06:58:35","date_gmt":"2013-08-01T06:58:35","guid":{"rendered":"http:\/\/blog.mozilla.org\/labs\/?p=9150"},"modified":"2013-08-01T06:59:28","modified_gmt":"2013-08-01T06:59:28","slug":"hatching-appmaker","status":"publish","type":"post","link":"https:\/\/blog.mozilla.org\/labs\/2013\/08\/hatching-appmaker\/","title":{"rendered":"Hatching Appmaker"},"content":{"rendered":"<p>Here&#8217;s our newest bi-weekly installment of Happenings at the Hatchery (&#8220;What&#8217;s Hatching&#8221;) and how to get your project (Mozilla or otherwise) to the next level (&#8220;Hatch This&#8221;). Enjoy!<\/p>\n<p><strong>What&#8217;s Hatching<\/strong><\/p>\n<p>With the introduction of <a href=\"https:\/\/www.mozilla.org\/en-US\/firefox\/os\/\">Firefox  OS<\/a> smartphones, we in the Labs&#8217; Hatchery have been thinking a lot about apps for them. Developers like me lust after platforms like this this because we find the technology itself so interesting. I think most users choose a device based on the functionality it provides\u2014functionality that is most often manifested in apps.<\/p>\n<p>We need a lot more apps.<\/p>\n<p>The Mozilla project is a global community of users, contributors and  developers. Wouldn&#8217;t it be great if we could put the power of building Firefox OS apps into the hands of more than just those that identify as Developers? Many have tried to do similar things to this, many have failed. We have hypotheses that may contribute to the success of this effort:<\/p>\n<blockquote><p>\nBuilding  apps should be fun. Building releveant, interesting apps can be fun for non-developers.\n<\/p><\/blockquote>\n<p>Games are fun. This seems like an obvious statement, but can we make building apps more like playing games? Can we make learning programming more like gameplay discovery than research? This requires experimentation. It will take more than whiteboards and debate. We&#8217;re going to test our hypotheses by building experimental software and introducing it to as many people as possible. We&#8217;re going to test it with users at <a href=\"https:\/\/www.campus-party.eu\/2013\">Campus Party UK<\/a>.<\/p>\n<p>Here&#8217;s our checklist:<\/p>\n<p><strong>Keep the Mechanics, Abstract the Details:<\/strong><\/p>\n<p>Within  SimCity, you learn the mechanics of city planning\u2014zoning neighbourhoods  and connecting roads. You do this without worrying about details like  permits.<\/p>\n<p><a href=\"https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/zone.jpg\"><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-medium wp-image-9149\" alt=\"zone\" src=\"https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/zone-252x128.jpg\" width=\"252\" height=\"128\" srcset=\"https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/zone-252x128.jpg 252w, https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/zone.jpg 439w\" sizes=\"(max-width: 252px) 100vw, 252px\" \/><\/a><\/p>\n<p>Our  goal in Appmaker is for the user to discover the mechanics of  event-driven programming, without worrying about details like for loops  and css layout.<\/p>\n<p><a href=\"https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/designer.png\"><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-medium wp-image-9142\" alt=\"designer\" src=\"https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/designer-252x158.png\" width=\"252\" height=\"158\" srcset=\"https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/designer-252x158.png 252w, https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/designer-600x376.png 600w, https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/designer.png 757w\" sizes=\"(max-width: 252px) 100vw, 252px\" \/><\/a><\/p>\n<p><strong>Components &#8212; &#8220;A Thing I want&#8221;<\/strong><\/p>\n<p>In real-time strategy games, the player produces units. Units perform certain tasks and work well with complimentary units.<\/p>\n<p><a href=\"https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/info_page.jpg\"><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-medium wp-image-9145\" alt=\"info_page\" src=\"https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/info_page-252x146.jpg\" width=\"252\" height=\"146\" srcset=\"https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/info_page-252x146.jpg 252w, https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/info_page-600x348.jpg 600w, https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/info_page.jpg 800w\" sizes=\"(max-width: 252px) 100vw, 252px\" \/><\/a><\/p>\n<p>In Appmaker, we&#8217;re calling these things components. Components linked  together provide the functionality of an app and expose the features of  the phone. <\/p>\n<p><a href=\"https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/info_card.png\"><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-medium wp-image-9144\" alt=\"info_card\" src=\"https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/info_card-252x256.png\" width=\"252\" height=\"256\" srcset=\"https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/info_card-252x256.png 252w, https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/info_card.png 265w\" sizes=\"(max-width: 252px) 100vw, 252px\" \/><\/a><\/p>\n<p><strong>Advisors<\/strong><\/p>\n<p>Games have advisors to suggest where you might build or alert that you have trouble.<\/p>\n<p><a href=\"https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/advisor.png\"><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-medium wp-image-9141\" alt=\"advisor\" src=\"https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/advisor-252x207.png\" width=\"252\" height=\"207\" srcset=\"https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/advisor-252x207.png 252w, https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/advisor.png 459w\" sizes=\"(max-width: 252px) 100vw, 252px\" \/><\/a><\/p>\n<p>In Appmaker, you will receive tips and alerts to guide you through adding and connecting of components.<\/p>\n<p><strong>Lots of Action<\/strong><\/p>\n<p>In games such as Command and Conquer, when you use a tank to attack an  enemy unit, it moves and starts firing weapons. There is instant and  constant action.<\/p>\n<p><a href=\"https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/log.png\"><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-medium wp-image-9146\" alt=\"log\" src=\"https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/log-252x280.png\" width=\"252\" height=\"280\" srcset=\"https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/log-252x280.png 252w, https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/log.png 281w\" sizes=\"(max-width: 252px) 100vw, 252px\" \/><\/a><\/p>\n<p>In Appmaker, components will wait for events. As soon as they happen, the app lights up and data starts to flow. We&#8217;ll be complementing the activity indicators with a message log style console.<\/p>\n<p><a href=\"https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/activity_icons.png\"><img decoding=\"async\" loading=\"lazy\" class=\"alignleft size-full wp-image-9139\" alt=\"activity_icons\" src=\"https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/activity_icons.png\" width=\"227\" height=\"189\" \/><\/a><\/p>\n<p><a href=\"https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/activity_log.png\"><img decoding=\"async\" loading=\"lazy\" class=\"alignright size-medium wp-image-9140\" alt=\"activity_log\" src=\"https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/activity_log-252x93.png\" width=\"252\" height=\"93\" srcset=\"https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/activity_log-252x93.png 252w, https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/activity_log.png 315w\" sizes=\"(max-width: 252px) 100vw, 252px\" \/><\/a><\/p>\n<p><br style=\"clear: both;\"><\/p>\n<p><strong>Growing with the User<\/strong><\/p>\n<p>As  you progress in a building game, the components you use mature to fit  your situation. Games contain complex dependency hierarchies that are  slowly introduced to the user as they become more advanced. <\/p>\n<p><a href=\"https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/terran_tree.jpg\"><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-medium wp-image-9148\" alt=\"terran_tree\" src=\"https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/terran_tree-252x146.jpg\" width=\"252\" height=\"146\" srcset=\"https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/terran_tree-252x146.jpg 252w, https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/terran_tree-600x348.jpg 600w, https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/terran_tree.jpg 1332w\" sizes=\"(max-width: 252px) 100vw, 252px\" \/><\/a><\/p>\n<p>In  Appmaker we&#8217;re going to present the maker with a limited set of  components until they &#8220;level up.&#8221; We hope the maker will learn at points  of interest instead of being bombarded by huge amounts of information.<\/p>\n<p><a href=\"https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/pick_component.png\"><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-medium wp-image-9147\" alt=\"pick_component\" src=\"https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/pick_component-252x142.png\" width=\"252\" height=\"142\" srcset=\"https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/pick_component-252x142.png 252w, https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/pick_component-600x338.png 600w, https:\/\/blog.mozilla.org\/labs\/files\/2013\/08\/pick_component.png 644w\" sizes=\"(max-width: 252px) 100vw, 252px\" \/><\/a><\/p>\n<p>As with any positive hypotheses, we hope they test true. We hope that this is the beginning of something more than seems obvious.<\/p>\n<p><strong>Hatch This<\/strong><br \/>\nEvery  post we include some practical advice and tools to help you get your  product to the next level. This week we&#8217;re pleased to feature Mozillian  and WebFWD mentor Jane Finette on defining your customer value  proposition and key points of differentiation. Because it doesn&#8217;t matter  how much technical or design beauty your product has if it doesn&#8217;t  resonate with the rest of the world. <\/p>\n<p>Tune in to hear Jane and get some great tools to apply to your project so it matters.<\/p>\n<p><a href=\"http:\/\/webfwd.tumblr.com\/post\/27933281198\/the-customer-value-proposition\">http:\/\/webfwd.tumblr.com\/post\/27933281198\/the-customer-value-proposition<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Here&#8217;s our newest bi-weekly installment of Happenings at the Hatchery (&#8220;What&#8217;s Hatching&#8221;) and how to get your project (Mozilla or otherwise) to the next level (&#8220;Hatch This&#8221;). Enjoy! What&#8217;s Hatching With the introduction of Firefox OS smartphones, we in the &hellip; <a class=\"go\" href=\"https:\/\/blog.mozilla.org\/labs\/2013\/08\/hatching-appmaker\/\">Continue reading<\/a><\/p>\n","protected":false},"author":578,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[4213,19256,22904,33],"tags":[],"_links":{"self":[{"href":"https:\/\/blog.mozilla.org\/labs\/wp-json\/wp\/v2\/posts\/9150"}],"collection":[{"href":"https:\/\/blog.mozilla.org\/labs\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.mozilla.org\/labs\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.mozilla.org\/labs\/wp-json\/wp\/v2\/users\/578"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.mozilla.org\/labs\/wp-json\/wp\/v2\/comments?post=9150"}],"version-history":[{"count":0,"href":"https:\/\/blog.mozilla.org\/labs\/wp-json\/wp\/v2\/posts\/9150\/revisions"}],"wp:attachment":[{"href":"https:\/\/blog.mozilla.org\/labs\/wp-json\/wp\/v2\/media?parent=9150"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.mozilla.org\/labs\/wp-json\/wp\/v2\/categories?post=9150"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.mozilla.org\/labs\/wp-json\/wp\/v2\/tags?post=9150"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}