Startup PM Week 37: UI/UX Design as a Product Manager

Photo by amayli on Unsplash
  • Mockups: Static designs that focus on how a product is used and what it will looks like.
  • Prototypes: High-fidelity designs that simulate how a user will interact with the product (usually clickable).

Where do I start?

Prior to visualizing what a product will do, you will want to make sure you have an understanding of who will use your product and what you product will accomplish. I’ll give a quick overview, but please comment if you want me to expand on any of these topics in another post!

  1. Requirements Gathering and Prioritization: Once you understand your users, reach out to your product stakeholders and revisit your long-term product vision to document high-level product requirements.
  2. Competitive Analysis: Look at what other companies who are accomplishing similar objectives have done. This can help you to refine what features you need to include, what features you want to include and what it out of scope. You can also look at their product reviews to assist with your user research and feature prioritization.
  3. Design Inspiration: Once you have an idea of what type of features the product will include it can help to see how those individual features have been executed elsewhere. I often look up feature names such as “user payment” or “user portal” in Dribbble, codepen.io or even Pinterest.

Design Tools: Are they worth it?

You may have seen a lot of Product Managers sketch wireframes of their product to upload and share with their teams. I will admit that this is seemingly an attractive options because it is just so much easier to get out a piece of paper and draw, instead of learning how to master a design tool like Figma (which is what I use). Yet, I’ve found the following incentives for using design tools:

  • Traceability: Use your designs as part of the requirements gathering process! Some stakeholders will have a hard-time visualizing your product concept and this will give them a place to start. Additionally, you can take notes at each requirement gathering session and copy over your design to a new page before you start iterating. This will help you keep track of what decision were made, by who and why.
  • Real-Time Collaboration: Not only can you easily share your screen with product stakeholders and cross-functional teams, but you can invite them to view or edit your designs with you in real-time. This helps with trying out different design concepts and being able to receive immediate feedback. Along with the ‘undo’ button that makes it easy to scrap bad ideas without needing to rebuild the whole screen.
  • Plugins: Plugins not only save you time on sketching commonly used features, they can also help give you ideas on how to design common features when you are stuck. For me, Plugins were the biggest game changer, after I spent months thinking I had to design everything from scratch.

Figma Plugins

Feather Icons: Easily import commonly used icons in website and software applications.

--

--

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