Image shows florals blooming during spring.
Image shows florals blooming during spring.

Learn how to talk to customers, test ideas, and validate hypotheses.

Think back to the last time you had to sign up for healthcare. Maybe it was through an online marketplace or an HR website while onboarding for a new job. Were you able to easily understand and compare the insurance plans?


Image for post
Image for post
The Early Hunger, 2009, oil and wax on canvas.

Lately, I’ve been thinking a lot about design in the context of sustainability. I came across two people who offer different yet related perspectives.

Enrique Martínez Celaya is a contemporary artist from Cuba by way of Spain and Southern California:

“Creativity often comes from survival skills, from having to solve problems in inventive ways because you did not have more obvious means at your disposal. …


#NoBanNoWall

Image for post
Image for post
Source: Artist Sam Machado.

JANUARY 27, 2017, President Donald Trump signed an Executive Order that started prohibiting US entry of all refugees regardless of nationality and all individuals from seven majority-Muslim countries. That same Friday, Customs and Border Patrol officials began denying entry and detaining Muslim travelers at airports. Lawyers, volunteers, and protesters started showing up at airports.

JANUARY 28: By Saturday, conditions were especially bad for detained travelers and their families at Dulles International Airport (IAD). An estimated 50 to 60 travelers were being detained, some for up to 20 hours without food or access to lawyers. …


Volunteering with the Taproot Foundation and the Lab Zero Philanthropy Club

I had the pleasure of partnering with Chris Flitter, the cofounder of GratefulGatherings.org, to redesign her nonprofit’s website. This post is a behind-the-scenes look at our design process.

TEAM: Chris Flitter (stakeholder), Jennie Lambert (developer), and myself (designer).

TIMEFRAME: October 2016 — March 2017.

Poverty does not end when a family or veteran escapes homelessness and crisis and moves into an empty apartment. Chris and Donna founded a 501(c)(3) nonprofit to do something for families in tough situations. …


Design process behind-the-scenes

Image for post
Image for post
Playful Chef is a cooking set that engages children with fun cooking adventures.

Summary

I had the pleasure of working with Playful Chef founder, Lisa Ligon, to redesign and code her website, PlayfulChef.com. Here is a behind-the-scenes view of my design process.

Challenge

Lisa created a cooking set for children ages 3 to 6 in 2005 and licensed the intellectual property rights in 2013 to a subsidiary of Berkshire Hathaway called Mindware. After the acquisition, she still owned the URL “PlayfulChef.com” and had incentives to direct people to Mindware’s eCommerce site. Her old website was hosted on Wordpress and used an outdated and non-responsive template from 2005. …


Design considerations, thoughts, and feelings

Fellow UX designers — is it just me, or does every designer look at their personal design portfolio and think “yup, this is great… I just love my portfolio website. It really explains my process well. Is that my personality shining through, too? No need to ask for any feedback, I’m sure my friends will think it’s perfect.” (Insert cricket sounds)…

After many iterations and back-and-forth, I am happy to present my new product design portfolio, updated as of November 2016. Ta-da! What do you think?

The new site is not perfect, but it is live on the internet, done…


Learning on the go at Dev Bootcamp’s 2016 civic hackathon

Image for post
Image for post

I paired with three other developers at Dev Bootcamp’s 2016 hackathon to build an app that makes farmers markets more accessible. We used the US Department of Agriculture’s farmers market API to help people in the Bay Area find their nearest farmers market. You can view our code on GitHub here.

Team

  • AJ Grande — Google Map + USDA APIs and jQuery
  • Khalma Phimmachack — GitHub and API pro
  • Simon Situ — Google Map + USDA APIs and jQuery
  • Clayton Hopkins — Pitched idea, UI Design, HTML/CSS

Tools

  • Sketch App: I lead design-thinking for the group and mocked up wireframes using Sketch.

Image for post
Image for post
On April 7, 2016, I collaborated with two other coders at the DocuSign ’16 Momentum hackathon, where we built an app for Team Rubicon. We won “Best Mobile App Solution” and 2nd place overall.

Learning on the go at DocuSign’s 2016 Momentum hackathon

I worked with two other coders as the UX/UI designer at DocuSign’s “Hack for good” hackathon in 2016. DocuSign pairs with a nonprofit each year, so that designers and coders get to work on real life challenges — this year, we partnered with Team Rubicon, an American non-government disaster relief organization comprised of over 35,000 veterans.

Our team built a web and mobile app to help Team Rubicon manage liability and consent waivers that need to get signed on mobile in disaster zones by volunteers and disaster victims (renters and homeowners), utilizing the DocuSign API.

Team

  • Jessie Black, Developer — C#…

Five ideas that promote diversity in tech in a purple America

Image for post
Image for post
Maps of the 2016 US presidential election results, by Mark Newman at the University of Michigan. Shown from left to right: 1) a typical US map colored according to the electoral college at the state level, 2) a map showing shades of red and blue at the county level, and finally 3) a cartogram incorporating color shading and states drawn proportional to the number of their inhabitants. It’s hard to find ways that different perspectives are not helpful and important.

Ugh

The week after Trump’s presidential election has been, to put it mildly, rough. With so much uncertainty, white nationalist violence, and hateful rhetoric over the past 18 months, people — myself included — are understandably fearful and worried about harassment and basic human rights in Trump’s America.

This election should have been about actively supporting and advancing the rights and welfare of women, minorities, and LGBTQ-folk, not just keeping the status quo. Instead, we risk the status quo falling back in time.

For transparency, I am a gay, white, former-vegetarian, only-bikes-to-work millennial UX designer in San Francisco. Zero agenda, promise…


Three practical tips to advocate for web accessibility

Image for post
Image for post
This story is repurposed from my blog post published on labzero.com on 9/28/16.

Most people cannot imagine life without the Internet. But can you imagine being the only person without access while the rest of the world carries on without you? I don’t know about you, but I’d give up a lot of other things before giving up the Internet.

Recently, web accessibility specialist at the University of California, Berkeley, Anna Gazdowicz, spoke with me about effective ways designers and developers can be more practical web accessibility advocates.

“Accessibility is contagious. Once you learn a few basic concepts about making the web more accessible, there’s ‘no going back’ because good design principles go…

Clayton Hopkins

Product designer focused on UX/UI and user research (he/him) claytonhopkins.com

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store