This project included a pretty detailed brief + wireframes which I was to take and create some UI around. The brand had already been created some weeks before so I had the logo, shape assets & typography ready to go. Typography rules (font-sizing, line-heights, letter-spacing, etc.) was up to me to define. The wireframes highlighted ideas + set a basic structure of what pages/features/flows were needed but I had a lot of freedom to pitch other ideas if I thought it would improve the UX. Below is a preview of the final UI that was sent over after a round of feedback. The whole project ended up being a quick turn-around and amounted to roughly a weeks work in total.
As I had an idea of the features/pages required in this, I was able to mess around with some layout ideas pretty quickly so I got a better idea of where to go with the design. A lot of the widgets/content was just made up by me to fill the space and give the team at RLTY some ideas of what could go where.
The ‘Sign up’ flow was created basically by me pitching the simplest approach and then refining based on feedback. We did refer to a couple of competitors but I’m struggling to remember at this time, these competitors and the team at RLTY helped define the need for less info and including the quick sign up/sign in options fit with this need.
This flow was very custom as there wasn’t a direct competitor to refer to here. I did have each step needed highlighted documented though so I was able to set up the top ‘Steps’ structure and build from there. As there were quite a lot of steps to cover in this flow and we were already sticking to just larger resolutions for the dashboard, I wanted to reduce the amount of screens in this flow without making the content or what we’re asking in each step seem cluttered. This created a sort of collapsed/expanded state for each question that you can see in the 2nd and 3rd screens below.
