UX Process Case Study
Let’s be real for a moment …
In the business world, very few projects actually follow along a “textbook” lifecycle …
Most of the projects in my portfolio don’t have a clean, progressive timeline. To fabricate such a narrative would be disingenuous. Creation is messy. Lots of things get thrown out because whose really interested in the iteration that didn’t work? Certainly not those who are solution focused.
Instead, below is the strategy that I operate out of.
1. The Process
Instead of a cookie-cutter progression of trendy tools, my process is rather simple:
- Ask | Listen | Observe
- Design | Document | Prototype
Here are some of my favorite questions:
- How many by when?
- What is the outcome of this meeting?
- What is the outcome we will achieve?
- Whose taking notes?
- Is it tested?
- Is this opinion or fact?
When you know me, then you’ll know that I love mind maps. So, here is a link to one of my UX intake templates – which should reveal much about my process. 🙂
2. The Tool Box
I leverage these methods to achieve outcomes, results, and insights.
Any combination of the following are used depending upon what the situation calls for.
Again, fluidity is important because, ultimately, we are responding to the infinite variations of reality:
- Pencil and Paper
- Listeners (dev tools that record events)
- Collaborative stakeholder sesssions
- On Site Research
- Dreams (really, so many solutions have come to me in this creative state)
- Field observation
- Effort Currency evaluations
- Quiet / alone time to process and think
- Split Testing
- Moderated Testing
- Micro Interactions
- Art Strategies (99% visible)
- Design Strategies (99% invisible)
- Years experience making beautiful things
3. The Documentation
The documents I create are only a means to an end – not the end itself.
- Mind Maps
- Site Maps
- Task Flows
- User Stories / Flows / Maps
- Personas (yes, they are worth the time … no matter what the current trend is)
- Wireframes (particular useful for developers and quality assurance – the details are very important to capture here)
- Lo Fi Prototypes
- Mi-Fi (export Sketch documents to InVision or Marvel or Finto or Principle)
- Hi-Fi (hand code HTML/JS/CSS trifecta … or, even better, leverage a framework like Angular)
- Listeners (dev tools that record events).
That said, let’s walk through an example of a textbook project that actually followed an optimal workflow!
The “Document Evolution” Cloud App
Design a cloud app which would enable bench scientists to move their traditional paper lab notes and protocols into a collaborative environment online.
Working name Document Evolution, this project would be realized in the Thermo Fisher Scientific Cloud as DocConnect.
Working with data scientists and the content teams, I designed a solution for scrapbooking lab notes, protocols, and manual instructions.
1. Initial Meeting
I was invited to a team off-site where the content team was trying to figure out what would be a competitive next step for their department in the upcoming year.
Looking at what the moderators were describing, I quickly drew an idea for the app that would be Document Evolution.
2. UX Interviews & Flows
I interviewed stakeholders to understand the scope and flow of bench scientists. Exploring how Thermo could transform lab collaboration, I “design-thinked” concepts and mapped descriptions into user flows.
3. Lo-Fi Wires
From the design-think artifacts, I drew lo-fi wires. Once core screens and states were rendered, I went back to the same stakeholders and presented them in the form of a “talk-aloud”.
4. Hi-Fi Prototype
Once we acquired internal funding, we started to plan moderated usability testing.
With revised wires in hand, I started to build out a full scale Hi-Fi prototype with pure HTML, CSS, and pure JS.
5. Usability Testing
From within the viewing booth during the testing, I updated the prototype in realtime to accommodate new issues and scenarios that were revealed or suggested by the users.
6. Document Delivery
In a post-mortem, I complied what we learned into wires and published them on our UX server so our development team could refer to them from a single access point.
Working with the business analyst, I made sure each page had the corresponding Jira ticket number referenced in the Axure wires (so they could use the browser find functionality to drill down to their current ticket.)
7. Live in Production
I handed off my designs to the Cloud development team and, working with their assigned UXr’s, they were off running!