How to start designing without designing.

I’m a Noob in the UX space. I’m usually a Front-end Developer collaborating with Designers and Developers writing HTML, CSS, Javascript. There’s recently been an opportunity at work to try UX so I decided to attend the UX Conference, this year in Brisbane.

I was introduced to this method at a workshop run by UX Mastery. It’s based off something that some awesome dude used at BaseCamp/37 signals. I even managed to find an article by them here

It’s called Writing out your UI Flows. It’s quite simple but so effective. You write What the users sees on the top and then What the user does on one
post-it note then rinse and repeat.

Ui Flow Template
UI Flow Template

I find this so helpful to clarify the design problem of what you are trying to solve. I’ve used this UX workshops when you have Subject Matter Experts, Stakeholders, Business Analysts in a room to help them express how they see their problem being solved. The post-its help as you can re-arrange and adjust certain steps of the flow. This opens up the discussion and helps people to re-think how things can be differently.

It also helps to see where certain steps live so when it comes to Wireframing you can see where things belong. Just to emphasise that each post-it note is not a screen, rather a step in the flow. You can see this in the example below of a RSVP flow. The RSVP Screen has different actions the user can do on that screen and each action can lead to different screens.


So if you don’t know where to start with your design. Start here.
Writing UI Flows down have helped me step back from implementing a solution straight away and to rather solve the problem at hand.