How to get straight to the point, ideate quickly, and give your users something to react to.

Overview

We all know that when it comes to UI/UX, ideation is essentially the first stop on the road to any great product or service.

You’ve got a core concept, you’ve checked it against your target users, you’ve done the research, you understand your information architecture, you’ve got the data; now it’s time to get into ideation.

Today, I’m going to show you how get straight to the point, ideate quickly, and give your users something to react to.

Speed is the name of the game

I don’t care what anybody says, if I’ve learned one thing over the last decade in the design industry it’s that speed is among the most highly valued of all attributes.

Photo by Karol D from Pexels

If you can do it fast, you’ve got the job.

With that said, the same goes for your users. They don’t want slow, painstaking, or onerous; they want fast, slick, new, and tailored to their exact needs based on their usage requirements.

To that end, it can be really helpful to focus on three things before you really deep into ideation:

1. What does my user want and need based on the research data?
2. How fast can I help my user get from where they are to where they want to be?
3. How can I make the process of getting there as seamless and enjoyable as possible?

Sketching is great

When you’re getting into ideation, starting with sketching can be a great idea if you just need to get a ton of ideas out all at once.

Sketching is great, but it gets dirty fast.

Sketching UI’s, UX flows, how these screens relate to your overall information architecture (IA), etc. can be super fun, and I’ll admit that letting your imagination run wild as a designer can be incredibly freeing.

That said, in my personal opinion, and in my practice…

Wireframing is better

I have nearly always gotten started with sketching, but transitioned to wireframes incredibly quickly because of three, key reasons:

Wireframing is clean, and it’s way easier to keep it that way.

1. Wireframes are already digital
2. Wireframes can be easily shared
3. Wireframes are easy to test

Let’s talk about it.

They’re already digital

With sketches, you’ve either gotta scan them or somehow transpose them into your prototyping software to allow you to test them with hotspots.

With wireframes, you’re more than likely already in your UI/UX software, and you can pull those frames directly into prototype mode, or modify them as-needed.

They’re easily shared

Sketches are cool, but they’re messy, can be hard to make out, and even harder to articulate even with annotations.

With wireframes, you share your file and open it up for your team to leave notes on, collaborate, annotate, ask questions, garner feedback, and get it done a whole lot faster.

They’re easy to test

Lastly, sketches can be really hard to test because many times sketches are easy to misinterpret.

Your users shouldn’t have to guess about what a particular screen is or what it does, they should be able to recognize the pattern right away and interact with the frames in a way that feels comfortable for them.

How to ideate quickly

So how can we ideate as quickly as possible? Here’s what I like to do:

• Load up your design software ( I like using Figma but that’s just me).
• Referring to your IA, flow diagrams, and user needs/outcomes from your research, start identifying the screens that you’ll need section-by-section.
• Choose a section that you want to work on and get hashed out.
• Set a timer for exactly 10 minutes.
• Move as quickly as possible, generating as many design ideas as you can for that particular section.
• When 10 minutes is up, look at your work and see if you want to go another round right now, or move onto the next section.
• Repeat in rapid succession for about an 45 minutes to an hour and then step back to see your work.

By this point, you should see a huge amount of ideas taking shape. From here, you can start to narrow your design decisions down based on your data and your content requirements.

How to to get it done even faster

Now, don’t get me wrong sketching can be fast, and so can wireframing by hand, but what’s even faster is leveraging pre-built assets to help you make it happen.

To that end, I have included not one, but TWO brand new Figma resources that I created to help you out:

• Lightframes, and
• HotSwap

Just so you know what they do ahead of time:

• LightFrames is a collection of pre-built iPhone wireframes for both light and dark modes of iOS.
• HotSwap contains base screens and UI elements for both iOS and Android, and is designed to serve as a base for your designs when you start getting more detailed.

Used in conjunction, these two resources can dramatically increase your overall speed and decrease your time-to-prototype, by helping you get your ideas into a sharable, testable format faster.

Bringing it all together

Today, we went over how get straight to the point, ideate quickly, and give your users something to react to as quickly as possible.

We learned that wireframes are easier to modify, share, and test in many cases than sketches can be.

Lastly, we took a look at timeboxed, section-based ideation, and some tools that can help you get it done even faster.

While this is certainly not a be-all, end-all guide on rapid ideation, this can serve as a solid approach to helping you get your design ideas into a sharable, testable format quickly, so that ultimately you and your team can get to market faster.