What is UX Design?
I define User Experience(UX) Design as an empathy driven practice used to come up with creative solutions to people and business problems by reducing obstacles and friction, with the goal being to delight the user and make them fall in love with our product.
The user experience is about more than just a clients' interactions with an interface. The user experience encompasses every touch point a client has with our products, not just the ones on a screen.
My Seven D's of UX Design
The 7 pillars of my UX process are discover, define, design, delight, deliver, deduce, and document. These steps may vary from project to project, but together they can lead to the successful launch of a new feature. By recording our insights and data, even failed experiments can provide valuable lessons learned.
Discover
Empathy is Key
Empathetic is the number one word I use to describe both my design style and my personality. I pride myself in being able to place myself in the customer's shoes. In order to do that, we need to gather as much insight into the problem as possible.
Problem Statement
What is the customers' problem? What issue are we trying to solve for them? What problem are we trying to solve? What is unique about our company that makes us best equipped to solve this problem? Being able to pinpoint the differences in these answers often helps us get to the true root of the issue at hand.
The goal of this stage is to understand the users, their needs, and the how that relates back to your brand. The first step is to meet with the product manager and other stakeholders in order to gather requirements and establish usability goals. This can often involve a gap assessment or usabilty audit of the current offerings.
Quantitative vs. Qualitative Research
"Qualitative and quantitative research and complementary methods yield different forms of data. Quantitative research methods, such as surveys, seek to generate numerical data that can be used to produce statistics and identify patterns. Qualitative research methods, such as focus groups, are used to understand opinions, attitudes and motivations; answering questions that cannot be quantified with numbers." - Understanding Quantitative vs. Qualitative Research
User Experience Research
UX research is conducted at this phase in order to learn more about the customers and their needs. When conducting research, I try as much as possible to glean information from actual users first before consulting Google. However, consulting the internet is a great way to gain additional analysis into your competition's approach to similar problems. There are numerous other great methods of doing user research such as:
Interviewing current or potential clients
Conducting internal or external focus groups
Sending social surveys
Finding where your audience gathers online or in person
Watching users perform usability testing on existing features
Coming up with a list of unanswered open-ended feature questions
Define
User Personas - Who is the Customer?
Crafting user personas for your different customer types is a great way of speculating how they may behave. I usually create 3-4 personas to represent users with different goals, needs, barriers, motivations, pain points, and interests. I base these personas off of the research conducted in the Discover phase, and will make sure to check back frequently that designs address their needs.
Defining Requirements
In the world of Agile development there are need to haves, and nice to haves. Assigning priorities is an important task and here we begin to answer these questions:
What features matter most?
Which features should we act on first?
What is feasible within the time period?
What is feasible from a technical perspective?
User Scenario Maps
We can begin to identify how some of these features may look by building a map of a user's interactions either online, or by using post-its.
Information Architecture - Card Sorting
Card sorting can be a great tool to learn how your users would categorize your pages. By placing each page on an index card and letting users categorize them, they end up helping you to define the different buckets for navigation.
Information Architecture - Site Maps
When a whole website or web app needs to be built out, it is often helpful to build an entire site map of every page and the subsequent pages they navigate out to.
User Flow Diagrams
These diagrams show an overview of how users can interact and navigate through your product. Using a series of shapes, and sometimes colors, flows can depict chains of actions and reactions across multiple pages.
Pattern Recognition
Here we may begin to identify themes between different parts of the flow. This enables us to use repeated user interface elements to establish consistency.
Delight
Pre and Post Design Review
In order to guarantee that I am always building a product for the user, and not trying to kettle a user around a product, designs will often go through several rounds of reviews. Sometimes I may start with the design phase first to establish the bones of a feature, and then later revisit the design to make sure it delights the user. Other times I may start by determing what would delight the user and bake that into the core functionality of a feature.
What's Love Got To Do With It?
As UX designers we often say that our goal is to delight our customers and make them fall in love with our product. Yet, we rarely stop and think to define what love means to them.
Author Gary Chapman is famous for writing "The Five Love Languages: How to Express Heartfelt Commitment to Your Mate". This book looks at how each of us express and experience love in different ways. The 5 Love Languages are: Words of Affirmation, Receiving Gifts, Quality Time, Physical Touch, and Acts of Service.
I first learned of this topic while helping my mother spruce up a presentation for a teachers' conference. While designing "Response to Intervention & Love Languages", I realized that like students, this method can be applied to analyze customers as well. Borrowing from a simple, but great article, "The Five Love Languages of Digital Marketing", we can adapt this for UX Design.
Words of Affirmation = Customer Reviews
Receiving Gifts = Discounts
Quality Time = Consistent Communication
Physical Touch = Touchpoints
Acts of Service = Giving Back
We now have a unique way of defining what love means to different users. I have not done a UX study since discovering this, but I'm very curious to see how this correlates with user personas.
How Might We?
The goal of this exercise is to encourage brainstorming and a change of perspective. Each question will start, "How Might We..."
explore the opposite?
play the devil's advocate?
amplify the good?
remove the bad?
change a status quo?
break this into smaller tasks?
Unique questions provide unique problems to solve, and this exercise is a great way to ideate unique solutions.
Opportunity Areas
This is a good time to review the current progress of the process and look for potential areas to improve. This is often when I imagine myself in the role of each of the personas created earlier to make sure their needs are being met.
Design
Wireframes
I love wireframing, it's the quickest and easiest way to communicate UX ideas. I love to start my design sessions with a piece of paper and a pencil in hand. Once I have a rough idea of the framework for the new feature, I will begin to transfer these drawings over to Balsamiq.
Paper Prototyping
Paper prototyping is a great way to rethink and restructure existing user interfaces. While at Session M, I made a habit reworking large scale forms and modals by printing out content in order to reorganize it on the wall for group thinking. In addition, creating a mobile device paper viewfinder is a great way to view mobile screens or check the viewport at different scroll locations to ensure a great user experience.
High Fidelity Mockups
The final stage in the design process was often to create a mockup of each page and page state in Sketch or Figma. The goal of these designs was to be as close to the representation fo the final live product as much as possible.
Interaction Prototypes
It's always a great idea to get an understanding of how transitions and animations may work on your app or website. InVision is a great tool to minimalistically, but quickly show how different pages link together. Low fidelity Balsamiq Mockups are a great way to replicate and change designs to emulate different page states.
If you're looking for something a bit more advanced, Adobe XD is a fantastic new tool to build interactive prototypes. Stellar animations and the ability to test across devices from one design source make this an invaluable new tool for ux designers.
Revisiting The Delight Phase
Before moving forward to the next step, I review the design to make sure that it delights the customer and continues to work well for the personas I created. I may need to go back to review for delight at this point and then make design updates again after.
Deliver
Sign Off
Final design mockups are usually presented on InVision in a stakeholder meeting where I would give the reasoning behind each design decision. Once the ux design has gone through enough revisions that all parties are satisfied, the project gets the sign off to make it's way over to development.
Deliverables
By this point, the Project Manager will have logged a story cataloging this feature for future development. This is usually where all provided design mockups and image assests, or links to those assets if they are stored in a digital asset manager, would go. A great tool I've used in the past to help deliver these assests as well as hexidecimal colors, padding, margins, etc. is Zeplin.io. It provides a great way to share, organize, and collaborate on designs, all built with the developers in mind.
Ben Gemborys, Friend to Developers
I've had a very close working relationship with developers throughout the years, and I continue to be in awe of their talents. I cofounded Qanairy for 4 years while working primarily with a back-end developer. I'm very approachable and outgoing so I have no problem collaborating with dev teams. I also consider myself a bit of a front-end developer, and feel like I know how to speak the language. This also helps me when determining whether or not the proposed development solution for a new ux feature is even feasible or not. Saving us and the engineers valuable time.
ADA Compliance
It is important to make sure that product or service is accessible to all, even those with disabilities. I work with developers to make sure that all images receive alt tags, navigation receives aria labels, and that all text maintains a proper contrast ratio. A designers job isn't done once they've finished designing. I am always available to work with engineers to make sure my designs are translated properly.
Quality Assurance
Having run a quality assurance startup, I am no stranger to making sure I deliver a flawless user experience. Testing out your features is mandatory to make sure that everything still works as expected. I usually also take this time to compare the design mockups to the staging environment to make sure they line up.
Ready for Release
Once all the boxes are checked, the project is ready to be released from staging to production at which point it lives in the live environment for everyone to see, but it's lifecycle doesn't end there.
Deduce
Maintain & Support
The initial response to your design improvements may or may not be well received as not everyone responds well to change. Trust your research and watch the response to the user experience. It's more likely that new features may require onboarding or info text to provide more context. Other times I may revisit the language in on the buttons or in the copy. More often than not, new feastures will just need to be under close watch to make sure they remain stable shortly after launch.
A/B Testing
Often the goal of a new release is to A/B test between two slightly different solutions to the feature to see which performs better. By testing these two features in the live environment we can get a quicker response and a larger sample size as opposed to testing during the research phase.
Data, Data, Data
There's good data and bad data. Having been in the design field since the beginning of the application of big data, I've learned that data is only one side of the user equation. When looking at analytics we must also take into consideration the emotional unmeasurables.
Ask For Feedback
Did your release receive the warm welcome you were hoping for? No, well if not, this is when I would ask for feedback from your users. Like A/B testing, getting in front of them is the best way to get an answer. Conducting surveys with customers after they've used the feature for a while is a great way to see if it lived up to their expectatioons or if there is still more to be desired.
Product Analytics Tools
Heap.io and Mixpanel have become two of my favorite new products. These very impressive tools allow you to track customer data down to each interaction. This allows UX designers to get a detailed look at the user flows and make sure they are being used as intended or to more easily see where hangups take place. Adding these tools gives you access to your users' behavior to help you convert, engage, and retain more users.
Document
An Advocate for Process
Oft-overlooked, process documentation has become my secret weapon. While at BJ’s Wholesale Club, I oversaw and authored multiple documents to help with communication, organization, and accountability across all departments. My documents helped BJ’s to break down barriers between legal and back-end developers, taught new employees how to onboard, changed how we committed code and documented changes, and set the foundation for our design style guide. It’s not glamourous, but documentation keeps the engine running smoothly.
Bug Reports and Feature Requests
I have adapted a system similar to Groove's Bug Reports and Feature Requests System to track problems and record interest in new features on projects like Qanairy. This allowed our teams to learn what our customers wanted and begin to grow proactively as a company. Documenting these reports and requests allows for a single gatekeeper who's responsible for every prioritization decision.
Keeping a Team UX Portfolio
This is something I wish I had thought of sooner. Moving forward, every major UX project will receive its own case study. Case studies are invalable not just for the UX designer, but for the entire team. It shows the team's growth and allows them to share and take pride in their collective progress.
While at BJ's, we occassionally had presentations where a team that collaborated on a new feature would present it at a public show and tell. I think this was great, but I'd like to take that even further with a shared google doc. I think having one location where the entire UX team could collaborate on one case study writeup would be incrdibly beneficial. In addition to being a way to log the reasoning behind design decisions, it would also be a great location to store before and after screenshots of the release. I think this would be a great location to log metrics that you are tracking or hoping to improve with the release.
Even Failures Contribute to Growth
Documenting your failures is a great way to actually learn from your mistakes. Putting things down on paper makes you realize the lessons you learned, the new techniques you tried, or even just a way to simplify your process next time. I never stop growing, because I'll never stop learning.