User-Experience (UX) design and writing naturally go hand-in-hand. When you design a product, especially a web-based application, not only will you see tabs, buttons, columns, boxes, etc. You’ll also see text for label and field names, buttons that say “Cancel” or “Continue,” column headings, etc.
The design elements are supported by the text and vice versa.
The text provides additional context and informs the person using the application and often tells them what to do next.
This is where a good tech writer or UX writer comes in. For example, let’s take a look at the Washington DC metro website. If you happen to enter the same metro station for the to and from locations, you’ll see this message.
While this message is actionable, it didn’t tell me to enter an origin location that is different from my destination location. So when I click on the drop-down menu that says “Select an option” and I select the same location again, this screen shows up again. It’s a never-ending loop!
Not a great user experience at all right?
Now, this is where a good UX designer comes in. A simple solution to prevent this from happening in the first place would be to shade out the original location so that I can’t select it again. Or, a UX writer might offer to simply change the text to inform the user that the origin and destination locations cannot be the same. Make sense?
UX designers and writers work best together when they both focus on the actual experience of the user.
There’s more to a product that making it look pretty. It has to be functional and helpful. Some questions they should continuously ask each other are:
- What is the user’s problem?
- How can we help them?
- What is the ultimate call-to-action
For this example, people are using DC metro’s website to either get additional information or get help with a particular task.
The design of the website is easy on the eyes, there aren’t too many words or too many colors. However, let’s think about the user and what they care about when they visit this website. The UX designer and writer are clearly addressing 3 common problems:
Problem: I need to figure how to get from point A to point B and how much it costs.
Solution: Design a trip planner
Call-to-action: Enter to and from locations to plan your trip
Note: The helper text gives the user examples of what to enter in the field.
Problem: I need to know when the next train is leaving from my location.
Solution: Design a schedule of buses and trains near the selected location.
Call-to-action: Show results
Notes: A better text option for the call-to-action, might be “Show schedule.” A better design might be to show a map so that the user can visually see where they are.
I need to know what’s going on with my metro line.
Solution: Offer an alert subscription service.
Call-to-action: Sign up for alerts
Notes: There is a space missing between “metro” and “alerts.” Also, it is not clear what “ELSTAT” stands for. Adding a tooltip – text that appears when you hover over the button would be very helpful to the user. The user has to commit to clicking on the button to find out that ELstat stands for “ELstat Elevator Alert System.”
As you can see in this real-world example, there are ways that UX designers and writers can collaborate to help improve the user experience. The better the user experience, the more likely users are going to use the metro for their transportation needs.
Now, here’s a fun exercise for you. If the next big objective of DC metro was to show that they offer affordable metro services, what project should the UX designer and writer propose?
For more fun exercises like this, check out Kimmoy’s blog. She’s an engineer turned UX and tech writer who is passionate about traveling and dancing. She dreams of salsa dancing in Colombia, but for now, she’s found her happy “work” place in the world of Tech, writing for cool apps every day, and training others including designers like you to become tech writers.