Building Trust with Users

The following note is taken from an UIE seminar presented by Steph Hay.

  • Users are skeptical: So how do we build trust with them?
  • Build Trust First: Trust makes users happy.
  • Gaining trust takes time: This is why it’s so valuable
  • Building trust isn’t easy: It’s not really free, either.
  • Building trust is awesome because it costs time and energy.
  • Trust comes from setting realistic expectations, then meeting them: Over and over again to infinite and beyond.

Set real expectations

Using words people actually say

Know yourself

You’re real. People trust real.

4 techniques for writing real-person content

  1. Test message in AdWords: Write user-oriented messages to test for clicks (nor conversions)
    • Specific: “Eating out too much? Learn how to budget”
    • Generic: “Know your finances. Save money. Worry less.”
  2. Embrace the unsexy words used in organic searches: Being found isn’t about selling or educating or being clever—it’s about being found
    • Toutapp: Write your Sales Email faster & know what happens after you hit “Send.”
  3. Look at entry points and top content in Google Analytics: Write more of what visitors are looking at…be proactive
    • Tealet found that its blog posts draws customers.
  4. The mom test: Your personal bullshit meter
    • If you’d feel like a tool saying it to your mom, you probably sound like a tool.

4 techniques for meeting expectations

  1. Don’t be abrupt: Be helpful even when you fail. After all, you set their expectations in the first place.
  2. Make your forms fail-proof: Be explicit in microcopy and specific in validations so the user always “wins” upon submit.
  3. Anticipate the gaps: Sweating the details of error messages or 404 pages shows
    you’re there even when stuff goes wrong.
  4. Ask users two questions:
    1. Why did you [sign up]?
    2. Why [do] you keep coming back?

Dan Uses Reasons; Dao Uses Big Words

This morning when I dropped him off at daycare, Dan gave me a hug before joining his teachers and friends. At 22 months, he has reason for everything. When we walked to our car after I picked him up from daycare yesterday, I asked me to carry him. His reason was that he’ll “fall and hurt himself if he walks.” When grandma asked him to share his jelly beans with his cousin Khoi, he told her that Khoi can’t eat it because “he’ll throw up.” When he doesn’t want to eat his food anymore, he told me that the food will make him throw up. I am so tempting to let my kids starving for a week in order for them to understand how fortunately they are. I haven’t been able to do it yet.

Since kindergarden, Dao has picked up some big words. While we were dining at a restaurant on Saturday, he kept on crying because he wanted his cousin Khoi’s train toy. I commanded him to stop whining and eat his food. He said to his mom, “Daddy is embarrassing me.” In another incident, he called us several times to sanitize him when he was done pooping. When I finally came to him, he said, “I am so disappointed.” Two big words in two days.

Le Mekong Goes Responsive

My client and I launched Le Mekong Vietnamese Cuisine’s web site almost five years ago. While the design stands the test of time, the codes are outdated. When the client asked me to optimize her site for mobile, I took the opportunity to rewrite HTML and CSS from scratch. The markups are now up-to-date and the layout is now responsive across all devices.

I also made some visual changes. The slideshow and banner images are now taking up the entire browser’s width, which makes the images bigger and more enticing. This site is still a fine example of how a small business owner could have her own brand and design rather than using the same template from Squarespace that millions of other businesses are using. Take a look at the new Le Mekong Vietnamese Cuisine.

Nicely Said

Writing web content is hard. Writing clear, useful, and friendly web content is much harder. Fortunately, Nicole Fenton and Kate Kiefer Lee’s Nicely Said, a concise, practical writing guide, will help you to accomplish that with ease. Whether you’re a designer or content strategist, you’ll learn finding your voice and writing how you speak. Required reading for anyone who works with content.

My First Calligraphy

The first project in Experiential History of Graphic Design took us all the way back to ink and paper. Each student had to write a quote in Gothic and the challenge was to use illustration to illuminate the quote.

Although I am a graphic designer, I am horrible at drawing and writing with my hand. For this project I had to practice quite a bit. By the time I had to write the quote, I actually felt comfortable enough to do it.

The quote I selected was from Nas’s classic Illmatic: “I never sleep, cause sleep is the cousin of death.” For the illumination, I went from using Nas’s portrait to NYC (city that never sleeps) to a simple drop cap using the eye of horus to a tombstone with a cross made up of eyes of horus.

For the final design, I stripped the illumination down to just using the cross and eyes of horus. I also replace the first letter I with a more fancy drop cap. I made the I red as well as the eye’s iris red. I am happy with the outcome. I’ll definitely pick up calligraphy again just for fun in the future.

Book Design

A thorough and illustrative guide to book design. Andrew Haslam starts with the origins of the book and offers his own definition: “A portable container consisting of a series of printed and bound pages that preserves, announces, expounds, and transmits knowledge to a literate readership across time and space.” Then he delves into design principles including grids and typography. He even provides technical tips such as paper engineering, printing and binding. It’s both a practical and inspirational reference for book designers.

Designing Books: Practice and Theory

A breezy yet comprehensive reference for book design. Clear fundamental principles, brief categorization of different types of book and beautiful selection of design by Jost Hochuli make Designing Books by Hochuli and Robin Kinross worthy of any designer’s desk. The book itself is elegantly in Monotype Baskerville with strong complementary of Univers 75 Black.

Web Design & Usability: Mobile Web Design

For the first project in Web Design & Usability, students were required to design a web site for smartphone devices only. The goal is to learn the process of creating a user experience within a constrained space. How would they handle visual layout, navigation, typography, images and user interaction on small-screen browsers?

For concept, I left it open so that students can come up with the type of projects they would like to execute. The minimum deliverables must include a homepage design, secondary design, a user-interaction design and another of their own choosing. Students may hand in screenshots showing how the pages work or a functional HTML demo.

For graduate students, they were required to design a tablet version in addition to their mobile site. Minimum deliverables must include a homepage design and another of their own choosing.

To help students thinking about their project, I assigned the following questionnaires:

  1. What is the purpose of your web site?
  2. Who is your user? (income, interests, gender, and age.)
  3. What problems are you solving for your users?
  4. Who are your competitors? (list 3)
  5. What actions should users perform when visiting your site?
  6. What features are important?

From my years of experience doing freelance design, contents had been the most challenging part to get from clients. I set out a deal with my clients that I won’t start the project until I get 75% of their content. I wanted to make that emphasis with students. Once they selected their project, I wanted them to focus on gather contents right away. Here’s a list of guideline I provided to them:

  1. Site name: design a simple wordmark
  2. Mockups: list out the four pages that they’ll design
  3. Navigation: although they only create four pages, the navigation should be a complete representation of their site
  4. Page contents: everything that goes on each page such as messages, texts, images, video, products, buttons and forms
  5. Footer: ways to connect such as contact info and social media

To help students think about usability, I assigned the following readings from Steve Krug’s Don’t Make Me Think, Revisited (3rd Edition):

  • Chapter 6: “Street Signs and Breadcrumbs”
  • Chapter 10: “Mobile”

After content gathering, students worked on their wireframes. They have the freedom to create their wireframes in whatever tools they felt comfortable with. Even pen and paper were fine. I was more interested in the way they present the concept than their visual ability. Students then shared their wireframes with each other for feedback.

For their design mockups, students have the freedom to use whatever tools they like. Most used Photoshop, some used Illustrator and InDesign. My only restriction was that they have to fit their site in a 340-pixel width. Students then presented their mockups to the group for feedback. They also get individual feedback from me. Graduate students were more involved in the critiques than the undergrads. I am working on improving that in the next project. Furthermore, I incorporated Disqus to our course site for online discussion and posting class status. Although I am not getting much participation from the students, it’s a great tool for me to communicate with them.

For the final execution, most students did well. Some were struggling a bit, but they pulled through. I am pleased with what they have done. I put together a Pinterest board to showcase some of their works.

Richard Hendel’s On Book Design

The following references are from Richard Hendel, On Book Design:

If printing is the black art, book design may be the invisible one. (p.1)

The more mundane the object (a pencil, a book), the less we think about its design. The more often we use it, the less we think about how it came to be. But the simplest object often has very complicated specification for making it.

Book design us, indeed, an arcane subject. We need context to understand it. Knowing a technical vocabulary does not provide that context; rather, we need to be aware of the specific problems that book designers must consider as they work. (p.1)

Among the many ways a book can be designed there are three main approaches:

  1. typography that is neutral as possible, suggesting no time or place
  2. allusive typography, which is purposely gives flavor of an earlier time
  3. new typography, which presents a text in a unique way. (p.12)

Although some designers claim to be able to design a book in all its essentials before choosing a typeface, I cannot. The typeface I use influences so many other parts of the page that until I can settle on which to use, I am unable to carry on. It is the basis for everything else. Choosing a typeface can be the most vexing, infuriating, time-consuming, and pleasurable part of designing a book. (p.35–36)

The author’s words are the heart of book design. To solve the design problem for a book, a designer needs to know both what an author is saying (what a book is about) and how it is being said (the actual words being used). (p.33)

Assuming I can understand the subject of the book, I usually read the introduction or first chapter, and I read some of every few pages to get a sense of the author’s style. The author’s vocabulary often dictates the typeface I use. (p.33)

On Book Design

Drawing from three decades of experience on book design, Richard Hendel skillfully extracts principles of what goes on inside the book. Concise explanations, generous illustrations and inside information of how designers work make it a must-read not only for book design, but also for any publication design that aims at creating effortless reading experience, including the web.