Initially, I explored how we could build a seamless experience where a user could create a Yat from any point on the website. One of my first ideas was to incorporate it into the page's header and allow users to quickly expand the search bar to reveal the picker. In the early phases of Yat, we were taking a lot of cues from domain services such as Godaddy and other domain registrar websites because the initial idea for Yat revolved heavily around being able to use a Yat as a URL.
Because the experience of creating strings of emojis was so unique to our project and arguably one of the most important aspects, we decided to create a production prototype that we could use to get a feel for what features worked and didn't work. This also allowed us to test the feature with real users and gather feedback before committing to one direction.
The alpha version of the emoji picker was an incredible learning experience for myself and the team as it gave us crucial insight into the parts of the experience that needed improvement.
The biggest learnings revolved around the usability of the picker itself. While gathering feedback, we noticed that it took a lot of work for users to explore different combinations of Yats, and it was a slow process to find emojis that you were interested in unless you knew the exact name. Besides usability, we also took this time to rethink the experience as a whole, moved away from focusing on a "domain style" website, and transitioned to an experience that focuses on creating identities.
The design thinking and updates from the initial prototype were a huge leap in terms of the overall experience for the picker. We dialed back unnecessary clutter and created a very streamlined and focused experience.
Instead of having multiple input fields, we combined the emoji search and Yat selection fields into one so users could easily see the Yat they were building. We also took this one step further and built keyboard functionality into the search experience that allows users to search, select, edit, and reorder a Yat without needing to take their hands off the keyboard. This made the experience of building Yats exponentially faster and a lot more fun.
At this point, I was confident with the direction of the feature and felt the early rounds of exploration and user testing were crucial to its success. We closed off the design phase by adding cart functionality, slightly refining the design to achieve a more uniform hierarchy, and doing a better job of educating the user on their task.