Generative UI Prototype #1

Teisanu Tudor
2 min readApr 10, 2020

Setting initial goals for my little chaos machine. The first three or four posts are written in retrospective; realized too late that I should document this process.

There’s a huge amount of philosophical and also emotional discussions going around generative design. Sometimes when people misunderstand it, they feel like it’s just handing everything off to the algorithm or computer. That’s not what it’s about. It’s about, as a designer, to build your you own tools and to be able to go way beyond the current capabilities of what we are able to do as designers. — Patrik Hübner in https://medium.com/@edenspiekermann/generative-design-q-a-with-creative-algorithm-developer-patrik-h%C3%BCbner-aad03ab601bb

I’m building a software that would support designer’s early high fidelity process. Shortly, it is inspired by the generative design processes used in architecture and manufacturing to create thousands of options based on well-defined parameters and analyses. I wrote a more in-depth article this topic and my motivation https://uxdesign.cc/involving-computers-in-early-high-fidelity-design-beyond-moving-pixels-a0183a672260

Many images placed on top of each other being iterations in the design process. Variety from illustrations to photography
This is what happens if I stack early variations that I played around with for a project

Remember those hours spent exploring solution in the high fidelity design stage ? Hours spent on anything from totally ditching everything done until now to moving tiny pixels around. Well, maybe a software could help in creating thousands of small iterations, in a design space that we define — knowing the project goals, findings and hopefully what makes a good UI. My end goal is this:

Given parameters and logic, the software will provide a large amount of options for a component (e.g. button) , group of components (e.g. card) or layout level. These options could be then evaluated based on generic usability criteria.

Obviously this is a long term goal that needs to be broken down into tiny tiny ones. I’m not a professional developer and have a full time job as well. So, the first iterations should just include the following:

The ability to generate a large amount of options for one component - buttons; and one layout — onboarding screens . Options should explore all their individual properties e.g. padding, text alignment, layout, etc.

As much as I’d like to include the automatic analysis of the generated option, I believe that is a much broader topic that could potentially include machine learning and other fancy stuff I’d like to learn. I’m intentionally not specifying anything about tools, technology, process — I’ll learn on the go. So, let’s get started…on paper I guess.

--

--