Designing a Digital Product People Want to Use

Every product has its own unique set of challenges to solve, stakeholders to satisfy, and user stories to consider. Websites, web apps, native apps, social media platforms, and emails are just a few examples of the types of digital media that shape our everyday interactions with the internet, and they all have designers behind the scenes whose job it is to visually guide users through the product. Even within those categories, no two products are exactly the same, so each user experience team needs to decide which UX values are most important to prioritize.

In this article I’ll present the five main UX principles I use to measure my own success as the Manager of UI/UX Development at NarrativeWave. Our SaaS (software as a service) solution helps some of the world’s leading energy organizations more efficiently utilize our world’s resources. Since our product is self-service analytics software, ease-of-use is of paramount importance in our user experience ethos.

NarrativeWave’s design challenges include:

Readers who also work on a product team can follow along by coming up with additional examples relevant to your own digital experience.

Usable

A good product must be accessible by anyone in its target audience. For example, a transit route planning app is most valuable on the go, so it needs to function on mobile devices with spotty internet connectivity.

Usability also encompasses visual branding and graphic design. A product’s aesthetic should never be a barrier to entry, but a means to an end. Usability should never be sacrificed in the name of decoration. Users quickly leave a website or abandon a product when it’s unsightly, outdated, or obnoxious.

Challenge: Be usable such that customers are empowered to configure their own analytics

Solution: Easy-to-use, self-service builders

One of NarrativeWave’s latest usability initiatives is a redesign of the Analysis Builder. Our main goal is to make the builder easier for our customers to use and understand, including those who are not data scientists. With the new builder, our users will be able to get up and running in less time, because we’ve designed it with simplicity in mind.
NarrativeWave's new analysis builder

Keep it simple! The “for dummies” series exists and is so popular because the answer to “explain it to me like I’m 5” is often all the information people need. Some of the most thoughtful and beautiful user experiences are born from the goal of simplicity. Having a user manual is great, especially if the product is very technical and intended to be used primarily by experts. However, as a rule of thumb, my challenge to designers is to first pretend that the user won’t have one. Design around that assumption, and then consider if one is still needed. Sometimes the answer will be yes, and that’s ok. The more of a product’s story that can be told visually through hierarchy and flow, the faster and easier it is for the user to achieve what they’ve come to do, and that’s a key mark of a successful product.

Valuable

Why should users choose this product versus a competitor? If a designer or team can’t answer this question, either the product needn’t exist, or they need to understand it better before attempting to craft user experiences for it.

Those who have written a research paper will remember that ATP means “answer the prompt”. Consider, why do people use this product? What goal have they come to accomplish? What problem are they trying to solve? Humans have short attention spans, so make sure users can understand what they need to do, and do it relatively quickly. Again, keep it simple, and don’t introduce non-valuable experiences that do not contribute to user goals.

Challenge: Provide value by helping engineering & data science teams improve asset performance

Solution: Gain and maintain their trust by providing measurably useful information

Longroad is a leading renewable energy developer. NarrativeWave is their primary system for asset management workflow across their entire fleet. Our value dashboards, event management, and structured actions have proven essential to their daily work. Longroad’s feedback on the product speaks for itself: “NarrativeWave has the unique mix of flexibility and expertise that amplifies the capabilities of our performance engineering team.” (Robert Pharris, Director of Engineering)

Credibility is another factor that contributes to a product’s value. Why should users trust it? It’s important to establish credibility as a product, but this is difficult to do because it’s abstract. Keep in mind while a product is being designed that credibility will need to be established in practice.

Organized

The best information in the world is useless if nobody can find it. Findability can be achieved through design in multiple ways, including hierarchy and familiarity.

Everyone’s brains work slightly differently, but in general, people can more easily digest information when it’s laid out in a structured format. Make sure the navigation is laid out in a way that makes sense so users can find what they need.

Hierarchy encompasses both visual weight (bigger elements, bolder colors, higher position on a webpage) and information structure (flow from general to specific). When used correctly, design concepts like hierarchy are powerful tools to guide users through a digital experience.

Challenge: Organize complex information into tidy layouts and simplify elaborate data

Solution: Leverage hierarchy to prioritize the most important information

When some condition triggers an event (i.e. an inverter on a solar farm is underperforming), NarrativeWave generates an event report to capture valuable information about the issue. This page is packed with valuable information, like affected assets, previous occurrences, corrective actions, and user comments. This data is organized into neatly labeled sections, which is a good place to start. By taking it one level further and asking the question, “why does a user visit an event report?,” we gain insight into which sections of the page are the most valuable to them, and should be given the most visual weight.
NarrativeWave's event report

Humans are creatures of habit that prefer when things are familiar. Design patterns can establish consistency. Re-use styles, layouts, visual flows, and colors whenever possible to establish a shared language with the user. A style guide can be a helpful tool to keep the whole team aligned.

Interactive

How are users meant to interact with this product? Bad interaction design frustrates people, while good interaction design keeps them coming back for more.

Give the user some feedback when they’ve performed a task. Even a simple success message, hover effect, or color change on click goes a long way towards establishing trust with the user. Most (if not all) of the interactions in the product should be user-led. Action A should lead to outcome B. How many of us have entered a website, been greeted by a popup modal, and immediately closed out of it because we didn’t prompt it?

Challenge: Allow users to interact with large quantities of information

Solution: Demystify data as much as possible through interactive visualizations

NarrativeWave helps users understand complex data using several different types of plots, charts, and graphs. Many of them are interactive, which puts the user in control of their visualizations, and provides them with additional information about the data being depicted.
Interactive energy waterfall chart

Randomness is the enemy of logic, and randomness can create a jarring experience. Anything visually different naturally holds a lot of visual weight, so design anomalies responsibly. Don’t overwhelm users-- give them only what they need to efficiently achieve the task they’ve come to perform.

Researched

Thoughtfulness is a large part of successful user experience design. Care for the craft is self-evident. The more thought and time that is put into brainstorming and research in the early stages, the more it will show in the final product.

User-tested = User-approved. Know your audience, and then show it to them. Who is using this product? Pilot new concepts by conducting user acceptance testing (UAT) with those whose opinions matter most. Who better to do this with than a sampling of the target audience?

Consider developing a digital prototype to share with users ahead of development kickoff. Popular prototyping tools such as Adobe XD, Figma, Sketch, and InVision empower designers to explore and communicate product interactivity without any code. When a prototype is true-to-life, it looks and feels just like the product itself, which allows for realistic UAT without requiring the development team to invest several hours into building the functionality.

Challenge: Research the product’s ease-of-use with its audience

Solution: Benchmark it through user acceptance testing and continuous communication

During the research and brainstorming phase of the Analysis Builder redesign mentioned earlier, we developed an interactive prototype to share with a subset of valuable customers so we could incorporate their feedback into the final version. Our prototype was high-fidelity, which allowed our test group to experience realistic immersion without sinking dev time into any concepts that we ended up not pursuing.
Detection item prototype functionality

Good design is never truly finished-- it’s constantly iterative. Trends are always evolving, so it’s important to stay on top of them. Beyond that, understand how to leverage trends in an impactful way, instead of choosing designs just because they look nice. Explore all worthy options, make several sketches, brainstorm lots of concepts, and always take notes. Don’t subvert the process. The end product will be worth it.

NarrativeWave keeps user experience top of mind when developing new features because a product’s success is determined by its usability. We owe it to our users to make their interactions with the product as efficient as possible, because no product can succeed without satisfied customers. How does your team put UX first?

Allison Kennedy
Allison Kennedy
Manager of UI/UX Development