Refining profile boards and visual search
Role: UX/UI, Mobile
Project: KPCB Redesign Challenge
Timeframe: January 2018
Kleiner Perkins Fellows Programs (KPCB) prompts their design applicants with a redesign challenge every year. I settled on one of their portfolio companies and my more frequented mobile apps, Pinterest.
Redesign a feature of a KPCB company product.
Known as the world’s catagloue of ideas, Pinterest has become the place to discover, inspire, and share. With over 175 million active users and more than 50 billion circulating “pins,” Pinterest has become a visual search phenomenon that connects the creators to explorers, the professionals to
I decided to look at features directly concerned with how others and users themselves view or interact with their respective profiles.
Gauging the current experience.
Before delineating which feature(s) to redesign, I deconstructed the user flow to see what key components existed. Walking through this as a user myself allowed me to see what inefficiencies and ambiguities were present.
To confirm my findings, I interviewed 10 other avid users, looking for realigning pain points. I concluded my research with three main takeaways and narrowed my visual and experiential redesign to Saved Pins and Visual Search.
Below, I’ve provided a description and breakdown of saved pins and visual search. Because Pinterest is all about using striking imagery I also opted on revamping the visual interface of the profile page.
Current Profile Page
- Consists of name, biography, followers, and following
- Showcases your created boards, saved pins, and tried pins
Current Saved Pins
- Wide screen view of saved pin from select board
- Options to visit pin source, comment, add photo or note
- Scrolling further shows related pins
Current Visual Search
- Used to visual screen capture a specific part of selected pin
- Brings up related tags and pins tied to the cropped portion of pin
- Can add or remove tags to refine search for similar pins
Once I pieced together the user difficulties and their causes, I brainstormed solutions to ease the use of the app and thought of what their design counterparts would look like.
Redesigned Profile Page
1. Display three of the most frequented buttons up top (add pin, search pin, settings)
2. Reorganize profile information to remove unnecessary white space and separate user information from pins
3. Center align dividers for boards, pins, and tried, and highlight in red to emphasize the user location
4. Make editing options for board more accessible and apparent through visible ellipses
5. Redesign visual flow of board titles for ease of reading and style board layout to be consistent with overall theme
Redesigned Saved Pins
1. Frequented pin actions displayed across the top
2. “Save” changed to “Saved”: tap to expand for more options
3. Slider incorporated to show continuity between saved pins and increase movability between saved pins
4. “Visit” and “Add photo or note” compacted into one bar. Changed to “Tried it,” instead. Click to see photos and notes on this pin and also post your own reviews: truncates time taken to access related pins
5. Include an Add comment to leave own comments and see others’
Redesigned Visual Search
1. Have icon that suggests return to revert back to original saved pin
2. Include a cropping icon that finalizes action and then brings up related tags
3. Include redo button to recover deleted filter tags or to restart search
4. Ensure crop borders encompass totality of pin and spans across whole photo
5. Redesign tags so there is refined clarity when narrowing search, simple color toggles to show if tags are applied or not
Going deeper than visual design.
Overall, I learned in what ways my user research can help me properly form and justify my design decisions. If I could do the redesign again, I think I would focus more on the usability of one specific feature as opposed to getting caught up in the visuals and surface level changes in multiple features.
Up next — Testimony Coffee;