SMG  •  2018–2020

Survey Engine

ROLE

Associate UX Designer

OUTCOME

Accelerated new client setup time by 70%

SMG  •  2018–2020

Survey Engine

ROLE

Associate UX Designer

OUTCOME

Accelerated new client setup time by 70%

Survey tool interface and results shown on a laptop
Survey tool interface and results shown on a laptop
Survey tool interface and results shown on a laptop

15 years of paper surveys

SMG started with physical surveys in stores.
They got better data than anyone else at the time, but clients only got ONE survey change per year...

10 years of surveys in excel

As the tech age began, SMG created tools for standard digital surveys in excel. It was faster than paper surveys at 90 days but got bloated and highly specialized...

Before and after of a paper form and excel spreadsheets
Before and after of a paper form and excel spreadsheets

Gotta be quicker than that...

SMG insights were best in class, but clients were leaving: citing the time it took to start their program or request updates. In the modern technology age, these companies were facing quick problems and relied on SMG for quick answers.

A matrix of survey companies, where SMG provides the best data but is most complex
A matrix of survey companies, where SMG provides the best data but is most complex

Learning UX and starting fresh

I graduated in Design, so while the process to find user’s needs was familiar to me, the tools for software were new.

What started with my first whiteboard drawings of the possible architecture turned into years of work, constantly revising our solutions to meet user needs.

4 versions

Major redesigns

6 rounds

UX research

50+

Participants

A whiteboard full of ideas and diagrams about surveys
A whiteboard full of ideas and diagrams about surveys

Many designs over 3 years...

More work went into these years than I can ever present on. I’ve listed out many of the features and initiatives I led, but I’ll only focus on a few here.

A list of many survey projects, with 4 underlined
A list of many survey projects, with 4 underlined

🏆  New Question types

(Before and After)

A before and after shot of the question types & icon options
A before and after shot of the question types & icon options

🏆  New Question types

Finding the right question-type was hard

Users struggled to find / add what they needed. We knew the names developers chose weren’t clear, but it wasn’t until we performed tests that the heat maps made it clear.

16 / 24 answers right  •  Success = 66%

Click heatmaps indicating users navigated the design poorly
Click heatmaps indicating users navigated the design poorly

🏆  New Question types

Simple icons + names helped

By adding carefully selected icons and clearing up the unique names, users selected the correct question type almost every time, and faster.

22 / 24 answers right  •  Success = 92%  •  35% faster

Click heatmaps indicating users navigated the design well
Click heatmaps indicating users navigated the design well

🚀  Survey Launch Flow

(Before and After)

A before and after image of the survey settings page
A before and after image of the survey settings page

🚀  Survey Launch FLow

Customers don’t want MVP’s

Product wanted to start slim with an “MVP”... which meant my user-informed designs got cut. To no surprise, beta clients began complaining the tool wasn’t easy to use. Which meant proving the value of UX with user tests (up next)

Side by side of the designs Tobias made, verses the lacking designs that got built
Side by side of the designs Tobias made, verses the lacking designs that got built

🚀  Survey Launch FLow

Back to the drawing board

To fix the problem, we needed to agree on a new collaborative solution. I spent a day on the whiteboard and brought my PM and Architect in to synergize...

A whiteboard full of redesign ideas for the survey project
A whiteboard full of redesign ideas for the survey project

🚀  Survey Launch FLow

A/B testing...

Clients could make surveys but couldn’t figure out how to launch them. Thankfully, our whiteboard exercise had led us to new designs we could test together here.

Comparison showing how Version B performed better than Version A
Comparison showing how Version B performed better than Version A

🚀  Survey Launch FLow

A/B testing... and C and D

A/B learnings helped us create C/D. The final result worked: users could navigate to finish and understand complex terms. Complaints even subsided on release.

Comparison showing how Version D performed better than Version A, B, and C
Comparison showing how Version D performed better than Version A, B, and C

📊  Survey Health Sprint

(Before and After)

A before and after shot starting in excel and ending with the results of the design sprint
A before and after shot starting in excel and ending with the results of the design sprint

📊  Survey Health Sprint

Tracking the right survey data

SMG was great at making quality surveys, but tracking their success and data was always manual. So I created / led a Design Sprint in Miro for our team....

1

What metrics are needed for all personas?

2

What metrics would be most helpful in this tool?

3

What metrics could be better solved outside this tool?

An overview shot of the format for the design sprint
An overview shot of the format for the design sprint

📊  Survey Health Sprint

Long term goals + concerns

Our team mapped out long-term goals (assuming everything went perfect) then synthesized to one. I also had them consider things that might go wrong, roadblocks to be aware of or resolve. This helped everyone align on:

   •   Where they’re headed
   •   What might stop them
   •   How to endure and succeed

A list of sticky notes about goals & problems from the design sprint
A list of sticky notes about goals & problems from the design sprint

📊  Survey Health Sprint

Walk in the users’ shoes flows

To help our cross-department team empathize with the end users, I had each of them map out the start to finish journey, noting highs and lows.

After the team shared their perspectives, we were able to create a single ideal flow (blue) that not only solved customer needs but also addressed key potential frustrations.

The design sprint user journey maps per participant
The design sprint user journey maps per participant

📊  Survey Health Sprint

Everyone can design

Our team knew our client’s needs the best. So after working together to define a future, they each sketched out their ideas for a solution.

   •   Allowed everyone’s voice to be heard
   •   Did not bottleneck design at the designer
   •   Ensured our solution was not partial

A picture of the design sprint participants drawings for ideas
A picture of the design sprint participants drawings for ideas

📊  Survey Health Sprint

A simple + proactive tracker

The end solution was more effective, simpler to use, and easier to develop.

1

Decided on the 3 key metrics needed

2

Changed chart to Version based with “Live”

3

Added user-friendly tool tips to define terms

4

Removed concept features that weren’t needed

Three final screens for the design sprint metric results
Three final screens for the design sprint metric results

💎  Futuristic Designs

(Establishing a long-term vision)

A before and after shot of the survey build page
A before and after shot of the survey build page

💎  Futuristic Designs

New interest + training the next designer

As our company got bought out, there was appetite to invest much more money into realizing the good UX work we had done! A new designer joined my team who I mentored as we gathered more competitive research and inspiration.

A collage of inspiration images from other survey software
A collage of inspiration images from other survey software

💎  Futuristic Designs

Mapping out current problems

As new Product leadership was hired in and got up to speed on our offerings, we created flow diagrams to show:

   •   The information architecture of our survey product
   •   Features that our product had, and the problems

We had 27 flows like this one by the end...

We had 27 flows like this one by the end...

A revised flow diagram for the survey tool
A revised flow diagram for the survey tool

💎  Futuristic Designs

A mockup is worth a thousand words

The next step after the flow diagrams was to show visually what these problems and potential solutions looked like. For every problem we listed with the current product, new future flows showed the solve.

A diagram with arrows demonstrating the survey tool flow
A diagram with arrows demonstrating the survey tool flow

💎  Futuristic Designs

Go time = many messy ideas

Our product team gave us the green light. They loved the examples we provided and saw the value in moving forward. Together with my apprentice designer, we dug in deep for several months to provide scalable future solutions to address our 4 biggest problems...

A view of many design artboards, showing the quantity of iteration
A view of many design artboards, showing the quantity of iteration

1

💎  Futuristic Designs

A proper, welcoming homepage

The mvp homepage had very few of the features customers wanted for a DIY tool. This update helped users to...

   •   Manage their full program without feeling intimidated
   •   View key health metrics from our design sprint on the surface
   •   Gain clear visibility to once-hidden advanced settings

2

💎  Futuristic Designs

A clean, responsive editor

The mvp editor was limited to desktop and full of small compromises that added up to many impossible interactions. This update...

   •   Set up the UI for a responsive design
   •   Reduced unnecessary elements, highlighting key ones
   •   Carved out the space for future differentiating features

3

💎  Futuristic Designs

An easy, helpful creation flow

The mvp solution did not make it easy to build with our SMG best practices. This update aimed to...

   •   Replace manual dev solutions with data-driven suggestions
   •   Encourage customers to explore recommended solutions
   •   Help customers find and build their surveys with confidence

4

💎  Futuristic Designs

An ordered, clear path for launch

Finally, the mvp launch flow (as stated earlier) was a hurdle for customers. This massive redesign aimed to...

   •   Teach clients what their survey will look like to customers
   •   Offer clients advanced configurations
   •   Empower clients to launch their solution without our help

A change in direction...

After years of hard work, the new leadership decided to leave surveys behind in favor of newer tech... While bittersweet, I’m grateful for all I learned and how it prepared me to design the new era’s Futuristic Vision for our company.

Looking back – This pivot by leadership never had real client demand. So when it failed, we ended up back at square one with even more tech debt… Since then I've learned to advocate for realistic solutions that both help the business & are desirable to users.

Survey Engine

Years

3+

Feedback

260

redesigns

91

Faster setup

70%

Survey tool interface and results shown on a laptop

Reach out

Do or do not, there is no perfect portfolio… so let's talk 🙂

© 2024 Tobias Reichert

Reach out

Do or do not, there is no perfect portfolio… so let's talk 🙂

© 2024 Tobias Reichert

1

💎  Futuristic Designs

A proper, welcoming homepage

The mvp homepage had very few of the features customers wanted for a DIY tool. This update helped users to...

   •   Manage their full program without feeling intimidated
   •   View key health metrics from our design sprint on the surface
   •   Gain clear visibility to once-hidden advanced settings

2

💎  Futuristic Designs

A clean, responsive editor

The mvp homepage had very few of the features customers wanted for a DIY tool. This update helped users to...

   •   Manage their full program without feeling intimidated
   •   View key health metrics from our design sprint on the surface
   •   Gain clear visibility to once-hidden advanced settings

3

💎  Futuristic Designs

An easy, helpful creation flow

The mvp homepage had very few of the features customers wanted for a DIY tool. This update helped users to...

   •   Manage their full program without feeling intimidated
   •   View key health metrics from our design sprint on the surface
   •   Gain clear visibility to once-hidden advanced settings

4

💎  Futuristic Designs

An ordered, clear path for launch

The mvp homepage had very few of the features customers wanted for a DIY tool. This update helped users to...

   •   Manage their full program without feeling intimidated
   •   View key health metrics from our design sprint on the surface
   •   Gain clear visibility to once-hidden advanced settings