Rethink, regroup, redesign: breathing new life into stale wireframes

Rethink, regroup, redesign: breathing new life into stale wireframes
This image was created with the assistance of DALL·E 2 - An abstract watercolor on redesigning stale wireframes

Every designer and UX professional has been there. You've been tweaking the same wireframe for days, making incremental changes, but something feels off. You might be stuck in a local maximum. It's a tough spot to be in, especially when you need to rally your team and find a fresh perspective.

In such situations, it's beneficial to take a step back and try a different approach. Here's a method that can jolt your brain, and that of your team's, to think differently about the design challenge in front of you.

Step 1: List Everything – The Grocery List Approach

Begin by listing out all the elements that need to be present in your design, much like how you'd jot down items for a grocery list.

  • Meat
  • Apples
  • Cheese
  • Bananas
  • Lettuce
  • Milk
  • Onions

This exercise isn't about making design decisions; it's just about laying everything on the table.

Step 2: Group Logically – The Affinity Diagramming Technique

Now, group the items based on their logical relationships. Think about which elements naturally complement each other. This method, known as affinity diagramming in the UX world, will help highlight patterns and associations that might not be immediately apparent.

Cheese and milk are both dairy. Apples and Bananas are fruits. Lettuce and onions are vegetables.

  • Meat
  • Cheese
  • Milk
  • Apples
  • Bananas
  • Lettuce
  • Onions

Step 3: Prioritize – The Wallet Constraint

Here's where it gets interesting. To prioritize the items, imagine constraints. If you only had limited resources, which items would take precedence? In our example, image we only have $20 in our wallet and we want to make tacos. We might prioritize our items in the following way:

  • Meat
  • Onions
  • Cheese
  • Lettuce
  • Milk
  • Apples
  • Bananas

This exercise forces you to evaluate the importance of each element, shedding light on what truly matters for your design.

Step 4: Reframe and Wireframe

With your newly ordered and grouped list, it's time to design anew. This approach ensures that the design serves the content, rather than forcing the content into a design. Use the prioritized and grouped list to create a fresh wireframe, taking care to organize the visual space based on both the importance and relatedness of the items.

If you're looking for inspiration or guidance in this reframing process, consider resources like the book Refactoring UI. This resource can offer valuable insights into optimizing user interfaces and can guide your renewed approach.

The next time you find yourself stuck in a design rut, remember this method. It's not just about moving forward; it's about taking a step back, gaining clarity, and then advancing with purpose. Encourage your team to embrace this method, and you'll find that sometimes the path to a breakthrough involves retracing your steps and viewing the challenge from a new perspective.