Ethan.Z
GramCity
Discover stunning photo locations anywhere, in no time.
Time Frame: One Week
My Role: Product Designer
Team: Myself and another senior designer
Tools: Figma, Adobe Suites, Miro
Product Overview
Gramcity is a photo editing app that helps users easily make their photos look more visually stunning before sharing them on social media. Additionally, Gramcity has created a vibrant community for photographers and enthusiasts who are able to find and share unique photo opportunities from all over the world. Whether you're an amateur or professional photographer, Gramcity provides the tools and resources you need to elevate your photography to the next level.
Define the problem
My Focus
Gramcity wants to explore the experience of finding exceptional photo opportunities for its users. We aim to create a seamless end-to-end experience for users to discover and capture memorable photographs, regardless of their location. Our goal is to design a solution that helps users quickly find photo opportunities that align with their expectations. Additionally, we aim to foster an active community of users who can share and discover their favorite photography locations. The problem has been defined as below:
HMW help the user quickly find photo opportunities that meet their expectation.
Understand my user
12 User Interview
To gain a deeper understanding of the challenges faced by Gramcity users when it comes to finding photo opportunities and to identify their needs, we recruited 12 participants for a user interview. The aim of the interview was to gather insights and feedback from the users to inform the design of a more effective solution for finding photo opportunities on Gramcity.
User demographics
-
Age between 21 and 40
-
Passionate about travel
-
Male (50%), Female (50%)
-
Interested in taking photos
-
Have social media post experience
This interview mainly ask about users how they find great new places to take photos. Here are some interview highlights:
“If I’m in a new city, I prefer to find some good places near me that I can take photos of while I’m enjoying my time traveling”
“Sometimes I look at Instagram for the most popular photos in the area and plan out my day from there.”
“Nothing worse than walking past a great photo opportunity and finding out about it later!”
2 Persona
To summarize the findings from the user interviews, two user personas were developed to represent distinct types of Gramcity users. The first persona, "Plan ahead Sarah," represents users who plan ahead for their photo shoots, while the second persona, "No plan Nick," represents users who are spontaneous and do not have a set plan when it comes to finding photo opportunities. These personas serve as helpful tools in identifying the goals, motivations, and pain points of users when it comes to finding photo opportunities. It also provides a valuable foundation for further design and development work aimed at improving the experience of finding photo opportunities on Gramcity.
.png)
.png)
User Journey Map
With a solid understanding of the goals and pain points of Gramcity users in finding photo opportunities, we proceeded to map out their overall experience. This allowed us to gain a deeper perspective on their needs and challenges, and identify areas for improvement. The insights gained from this mapping exercise were used to inform the design of a potential end-to-end solution. By considering the user's journey from start to finish, we were able to create a comprehensive solution that addresses their needs and addresses their pain points at every step of the way
Ideate potential solutions
Lightning Demos
Based on the findings from the user journey map, it was identified that the consideration and selection stages of the user experience could be improved upon. With this insight, the focus of the solution design was to create an interface that would allow users to efficiently find photo opportunities and obtain directions to the locations. Moreover, it was crucial to ensure that the photo opportunities presented meet the expectations of the users. To gather inspiration, I look for some existing solutions as the lightning demo. The demo provided a visual representation of the potential solution and helped to validate its effectiveness in improving the user experience of finding photo opportunities on Gramcity.
The "Find Home" feature in Zillow and Redfin served as an exemplary illustration of how users can locate nearby places based on their current location.
This example inspired me to consider incorporating visual representations of the photo opportunities. Additionally, it provided valuable insights into the implementation of a "Saved List" feature, which would allow users to easily keep track of their favorite photo opportunities and easily revisit them at a later time.
Creating a community that enables users to share and discuss photo opportunities was also a key objective. To achieve this, a review of Instagram was conducted to gather inspiration for the display of user posts and the actions required for users to create new posts.
Crazy 8s
With all the inspirations and ideas gathered, I narrowed down the desired flow and spent approximately 8 minutes generating 8 potential variations or design concepts for the solution screens. I then shared these ideas with another designer to obtain feedback and ultimately chose the concept to focus on.
Storyboard sketch
Upon determining the final design concept, I proceeded to create a storyboard for the solution wireframe screens. This helped to define the main features and necessary user interface (UI) elements needed to assist users in finding suitable photo opportunities. The storyboard served as a guide for the prototype and the key features were outlined as follows:
-
Presenting users with a variety of photo opportunity categories for browsing purposes.
-
Providing users with a map view of photo opportunity locations.
-
Establishing a "My List" for users to keep track of their desired photo opportunities.
-
Creating an active community where users can share their experiences and discuss their thoughts on various photo opportunities, thereby encouraging more individuals to contribute to the pool of high-quality photo opportunities.
Prototype my solution
Style Guide
With the storyboard sketch in hand, it's time to bring my solution to life with a high-fidelity prototype. This prototype will serve as a tool to gather feedback from users, which will allow me to make refinements and improvements based on real-world input. I will use the prototype to observe user interactions with the list and map view of photo opportunities and gather insights on how they respond to the photo opportunity categories I've created.
Users can search for specific locations, access their saved list, and tailor the display order of photo opportunities for a personalized experience.
Users can browse photo opportunities by selecting a specific category.
Display a preview of the photo opportunity through a thumbnail image to give users a visual representation of the location and the number of photos taken there.
The map view provide user a more clear view about the distance between their location and the photo opportunity location.
The detailed information of a photo opportunity can be accessed by the user, including pictures taken by other users as examples. The users can also obtain the route to the location by clicking the "Get Route" button.
The "My List" feature enables users to save and organize their desired photo opportunities for future reference and visits.
An engaged community that enables users to share and discuss various photo opportunities they have discovered across the world.
Test and Refine
6 Usability Test
I recruited 6 participants to participate in a usability testing session. The purpose of the testing was to observe their reactions and gather feedback on the design. I provided the participants with a set of task scenarios to complete, which included actions such as searching for a specific photo opportunity, adding an opportunity to their favorite list, and exploring the community feature. After completing the tasks, I conducted interviews with each participant to gather further insights and identify areas for future improvement.
​Scenario 1: You are visiting a new city and want to find photo opportunities in the area.
Scenario 2: Before embarking on a trip, you want to research and save potential photo opportunities at your destination.
Scenario 3: You lack photography skills and want to find inspiration and examples of great photos at your trip destination.​
Issue: Users experience confusion when trying to determine the distance between their current location and a potential photo opportunity location.
Solution: Display the exact distance between the user's location and the photo opportunity on the thumbnail view, allowing the user to select a photo opportunity based on proximity.
Issue: Users are unsure how to get to the selected photo opportunity location after viewing it on the map. The only option available is to see pictures.
Solution: Provide a clear and accessible link that allows users to get directions to the selected photo opportunity location. This will make it easier for users to plan their photo journey.
Issue: In “My List” users are confused about what types of photo opportunity they saved.
Solution: Provide clear categorization in "My List" to help the user understand the type of photo opportunity they saved and make it easier for them to find what they are looking for in the future.
What did I learn and what is my next step?
Reflection
Due to limited time, I didn't conduct the second round of my usability test. I believe I could get a better solution if I received more feedback from users. Through this design sprint process, I learned to focus on user goals instead of building out every single feature. For example, we wanted to create a personal page to showcase users' photos taken at different places. If someone becomes famous because of the photos they take, this would bring more business benefits for both the user and our app. We decided not to build it, as it was just a nice-to-have rather than a necessity. However, this feature could be considered the next step for the app.
The next steps for refinement:
-
Designing a personal page to allow users to showcase the photos they have taken at various locations, with the goal of attracting more potential users to the app.
-
Implementing a photo editing feature to help users improve the quality of their photos before sharing them on social media.
-
Including more detailed information about the photo opportunities, such as the best viewpoints, recommended equipment, and any precautions that should be taken when visiting the location.