{"id":2908,"date":"2016-09-27T15:30:19","date_gmt":"2016-09-27T13:30:19","guid":{"rendered":"http:\/\/leapfrog.nl\/blog\/?p=2908"},"modified":"2016-09-27T15:43:44","modified_gmt":"2016-09-27T13:43:44","slug":"generating-ui-design-variations","status":"publish","type":"post","link":"https:\/\/leapfrog.nl\/blog\/archives\/2016\/09\/27\/generating-ui-design-variations\/","title":{"rendered":"Generating UI design variations"},"content":{"rendered":"\"AI\n

I am still thinking about AI and design<\/a>. How is the design process of AI products different? How is the user experience of AI products different? Can design tools be improved with AI?<\/p>\n

When it comes to improving design tools with AI my starting point is game design and development<\/a>. What follows is a quick sketch of one idea, just to get it out of my system.<\/p>\n

\u2018Mixed-initiative\u2019 tools for procedural generation (such as Tanagra<\/a>) allow designers to create high-level structures which a machine uses to produce full-fledged game content (such as levels). It happens in a real-time. There is a continuous back-and-forth between designer and machine.<\/p>\n

Software user interfaces, on mobile in particular, are increasingly frequently assembled from ready-made components according to more or less well-described rules taken from design languages such as Material Design<\/a>. These design languages are currently primarily described for human consumption. But it should be a small step to make a design language machine-readable.<\/p>\n

So I see an opportunity here where a designer might assemble a UI like they do now, and a machine can do several things. For example it can test for adherence to design language rules, suggest corrections or even auto-correct as the designer works.<\/p>\n

More interestingly, a machine might take one UI mockup, and provide the designer with several more possible variations. To do this it could use different layouts, or alternative components that serve a same or similar purpose to the ones used. <\/p>\n

In high pressure work environments where time is scarce, corners are often cut in the divergence phase of design<\/a>. Machines could augment designers so that generating many design alternatives becomes less laborious both mentally and physically. Ideally, machines would surprise and even inspire us. And the final say would still be ours.<\/p>","protected":false},"excerpt":{"rendered":"

I am still thinking about AI and design. How is the design process of AI products different? How is the user experience of AI products different? Can design tools be improved with AI? When it comes to improving design tools with AI my starting point is game design and development. What follows is a quick … Continue reading Generating UI design variations<\/span><\/a><\/p>","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_feature_clip_id":0,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_post_was_ever_published":false},"categories":[625],"tags":[1085,1084,19,267,541,11,1097],"class_list":["post-2908","post","type-post","status-publish","format-standard","hentry","category-articles","tag-ai","tag-artificial-intelligence","tag-design","tag-game-design","tag-game-development","tag-interaction-design","tag-procedural-generation"],"jetpack_sharing_enabled":true,"jetpack_featured_media_url":"","_links":{"self":[{"href":"https:\/\/leapfrog.nl\/blog\/wp-json\/wp\/v2\/posts\/2908","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/leapfrog.nl\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/leapfrog.nl\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/leapfrog.nl\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/leapfrog.nl\/blog\/wp-json\/wp\/v2\/comments?post=2908"}],"version-history":[{"count":0,"href":"https:\/\/leapfrog.nl\/blog\/wp-json\/wp\/v2\/posts\/2908\/revisions"}],"wp:attachment":[{"href":"https:\/\/leapfrog.nl\/blog\/wp-json\/wp\/v2\/media?parent=2908"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/leapfrog.nl\/blog\/wp-json\/wp\/v2\/categories?post=2908"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/leapfrog.nl\/blog\/wp-json\/wp\/v2\/tags?post=2908"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}