project[3]
0344034.
BDCM
.Application Design I
::project[3]
project[3]: Lo-fi prototype
todo:
- Create a lo-fi prototype of the redesigned app
- Perform user-testing on the lo-fi prototype
process:
I decided to start from basically scratch rather than build from the prototype in project[1x2]. as it was built like a nest of a rat with ADHD — no use of components, design tokens, or even naming schemes. Note the "basically" in "basically scratch" though, because I did utilise some components I had lying around from other projects.
Branding
The first step, in my infinite wisdom, for this prototype, was a logo/wordmark for nomaid.
Figure 1.1.3, Logo & wordmark, 5/6/2022
Not very pretty, nor very creative (it's a shortened n), but that gives me a real asset to work with.
XD shenanigans
After that pocket of procrastination, I started actually constructing the prototype. The goal was to simply copy over the UI from the older prototype, but in a much prettier façade. There were a few "events" of note, though.
State
State & I are in an toxic relationship.
- I absolutely hate it, but it's absolutely crucial in creating somewhat advanced components.
- It's super restricting, everything I want to do I have to do it its own unintuitive way.
- It's super confusing, only certain attributes waterfall through from the default state, whilst other important ones (like text), do not.
It beats me when it's drunk.
Nevertheless, I put up with it, what other option do I have? (Please babe I'd never cheat on you with Figma)
Design tokens
Hate it too, what do you mean you're only valid for specific colours somewhere?? I want my design tokens in my drop shadows...
Prototype mode
I, surprisingly do not hate this. It's quite intuitive, with its node-esque representation between components/screens. However, its restriction of one action per interaction I feel is very arbitrary & really does restrict the things one can do. What if I want to click on a button, go to a screen A, wait a bit, then goto screen B, but if I go screen A from some other button, it won't go to screen B after a while? I needed this sort of functionality for the FTUE tutorial overlay on the home screen. I eventually relented to have an extraneous component showing up on the list, just to mirror everything on the home screen into another temp screen.
User testing
I found two willing participants off the street, codenamed "MT" & "CT". I was outstation at the time so getting ahold of either of these people were a little challenging. Alas "we move", as the kids say, & we managed to producing something out of the sh*tshow.
final:
|
Figure 1.2.1, Notion with everything arranged |
https://ljslol.notion.site/ljslol/app1-project-3-app-prototype-08326f15ee5746309cc071d648631a2b
Figure 1.2.2, Lo-fi prototype, 5/6/2022
reflection:
The experienced was, mixed. I've ranted enough above about state & whatnot, but the truth of the matter is that it was pretty fun. I did enjoy not only making something unique & weird-ish in terms of UI design, the challenge of actually executing it in such a confined environment did something for me too.
Beyond simply the practical skills mentioned above, I feel like I also honed the design eye for these UI things. There were a lot of micro changes that ended up in this prototype compared to the previous one. I feel like if I just kept redesigning this same app, I'd end up with something completely different at the end just because of everything miniscule picked up across each attempt.
At the end of the day, being in the UI/UX specialisation, everything learnt from this venture will be reimplemented into my next endeavors. Whether it be me creating a new prototype, or what lies beyond.
Comments