Generative UI Prototype #5
Besides moving the chaos machine to the web, I’ve started adding more features to the initial logic developed in Unity. Obviously, moving on brought a few issues and ideas that I tackled in this iteration.
First, I fixed the immediate issue of vertical padding values not being considered in the outcome. It was a simple variable naming error (duh). Now, the combinations are clearly varying from one to another.
Then I moved to changing colours. I decided not to add this as a field in which people would enter a range of colours explored in the outcome area. The entire interaction becomes complex and doesn’t really make sense — would anyone spend time on picking ranges ? Idea for later: it would maybe be interesting to give total freedom to the computer based on more abstract inputs, e.g. express familiarity, focus, culturally for South Asia, Western Europe, etc… Since the implementations was very similar, I also added corner radius as a similar parameter — affecting all generated buttons globally.
After I’ve added the corner radius as fixed values, I realized it didn’t really make sense. The more properties I have that change all designs globally, the more this will feel like any other design tool — beating my initial purpose. I decided that these should be added as a checkbox list (to do for later)
Afterwards, I’ve played around with letter spacing as another parameter to explore, as a range. I admit, not much thought was put into this -maybe it makes sense to keep it as fixed values only ? Since I had letter spacing, I quickly added capitalization as three options: lower case, title case and full caps. There is an error here though, letter spacing seems to vary for the first buttons only
Finally, I added a delete function, which took a while as well. I’m used to basic functions that simply remove anything in the “scene” having specific tags. I learned how Javascript relies on parent-children nodes in order to correctly remove an element from the domain. As basic as it may sound, I’m proud that I managed to remove only the elements I choose-in this only the buttons.
To do
- Add corner radius as a parameter
- Show the total number of combinations
- Show values combined for each button, underneath, or on hover ?
- Create functions for repetitive actions which will have different parameters as input
- Start asking and looking into how other designers as well, it would help in informing myself in some decisions
- Define and argue for parameters as inputs before generating designs: paddings, letter spacing vs parameters that change them afterwards: colour, corner radius — right now it’s all a bit random.
