TriPic is an image recognition application that helps lost travelers identify what's around them.
1 Designer (me), 3 developers, 2 PMs
Our process was highly iterative with constant jumping from research to quick ideation and fast prototyping only to get back to the drawing board.
2. Ideation & building:
3. Prototyping & Test:
Landing Page Experiments
We started to narrow down our problem space by researching what exactly do users want and what problems they are facing. We used both qualitative and quantitative research methods to understand their needs and wants.
For our interviews we went to public places like bus stops, airport, train stations and famous tourist spots to hear stories of different travellers and what issues they had. We found a lot of interesting insights including language problems,
Based on all the facts gathered from research, we were able to brainstorm and ideate around what we wanted to solve. We created a How Might We question to address this.
"How Might We help people in a city understand what's around them?"
Target Group & User Persona
We tested our initial ideas by quickly sketching them on paper and creating a paper prototype. It was helpful in understanding how users respond to our designs.
Some people took time in going through all the elements on certain screens which made us fix the information hierarchy there.
Users were confused about what to do at certain places showing that the primary action might be missing or unclear on that screen.
Some links were ignored by all the users telling us about their needs and wants.
2. Ideation & Building
We narrowed our research insights to ideate and build different solutions. We made multiple prototypes and improved them based on research and testing.
Wireframes - Initial Concept
One of our initial concept was to make the interface similar to Tinder but with events and tourist spots for recommendations. Users could like and dislike the suggestions and quickly create an itinerary for this.
But in our further research and tests, we had to pivot from this idea.
Wireframes - Final Concept
Our final concept was oriented towards something which people needed more, as suggested by our research. It is an image recognition application where users can take picture of whatever is around them and get description of it along with suggestions for events happening nearby.
High Fidelity Mockups
3. Prototyping & Testing
We tested all our ideas and thoughts in the quickest possible manner. We used paper prototypes and Invision prototypes for testing rough ideas and interactive prototypes build using Framer for more concrete ideas. We also tested our first few versions of the app with our target group in public locations.
We conducted usability interviews by creating a similar environment as our target user would be in. We used a big screen to put up some images of famous tourist spots and hardcoded the location of those spots in our prototype to get event recommendations accordingly. Many useful points came to attention while doing this.
Launch & Next Steps
After launching the app, we are looking forward to the next steps.
Optimize image recognition
Include more data sources
Include user profile to curate and present personalized information