Having been first introduced to human-centered design when she was in college, Teresa Torres graduated believing that was just how the business world worked. So when she got her first job as a front-end developer and interaction designer at HighWire Press, it was eye-opening for her to learn otherwise. "It was very much a client shop, and for the most part, we built what they told us to," Teresa says. "The end-user didn't really play a role in the process."
Everywhere she worked, Teresa saw the same problem—people didn't spend enough time with their customers. But how can you design and build great products if you don't have first-hand exposure to your end-user? That's when Teresa decided she wanted to help product teams address this problem.
Today, Teresa Torres is an internationally acclaimed author, speaker, and product discovery coach. She teaches a structured and sustainable approach to continuous discovery that helps product teams make effective product decisions with customer input. She's the founder of The Product Talk Academy and is the author of the book Continuous Discovery Habits and blogs at ProductTalk.org.
We spoke with Teresa to learn more about the methodology of continuous discovery, how to implement it, and why the key to good products lies in creating a continuous feedback loop between your product ideas and your customers.
My day job is brand and creative design, so I had a pretty high level of design before starting this project. I've developed some websites using Wordpress and designed some using Adobe XD and Figma. But I wanted to increase my web dev/design skills with Webflow. Webflow has been gaining a lot of praise and buzz within the design community, so I wanted to learn how to use it.
Wordpress is the known standard for no-code web development, but it's really clunky. Webflow attracted me because their branding shows it's very designed focused and they have great education courses (Webflow University). Their tutorials are very thorough and actually pretty fun to watch!
So my main goal was to get good at Webflow.
Mood Board > Design in Figma > Develop with Figma
I started to do a mood board of what style I wanted our site to look and feel like. I used Lapa Ninja, Dribbble, and Behance to get inspiration. I knew I wanted it to be fun and playful, but also give it a coolness factor. I also looked at podcast websites to see what features I wanted to add to our website. I got a lot of my ideas from one of Webflow's templates, Podcast X.
I then started to design the brand using Figma (they have a free version!). After fiddling a looooottt, I got the logo down and based the rest of the site design off of that. I looked on their Community page to see what other users have designed and duplicated their files to use for mine. After making around 8 iterations, I finally designed my website in both desktop and mobile. (Best practices say to also design for tablet, but I got lazy.)
I then went to Webflow and started developing the site. I looked on their Showcase page to duplicate other people's websites and use some elements from there. (As you can see, taking from other people is the key.) If I couldn't get something to work properly, I would Google it and look at forums to find the answers. Luckily, I also knew someone who knows how to use Webflow, so he helped me problem solve some bugs I had. Developing the site was waaaayyyy more frustrating and difficult than designing it. But you can find some shortcuts like duplicating other people's work and using cool things community members makes like F'in Sweet's Attributes.
Tip 💡
I would create a style guide for both Figma and Webflow. So that if you want to change the font, color, etc. you change it in the style guide, which then changes it everywhere else on your designs. This is a much better approach then having to change the style on each and every instance you used it.
And here's the finished project! I completed this within 1.5 weeks. I'll definitely want to learn both Figma and Webflow more by doing more projects.
.png)
