CLOSE
PhotoGrid’s homepage lacks information and there’s hardly any introduction. It was hard to tell what exactly value PhotoGrid can deliver to the users. To maximize the value of the online collage maker and emphasize the cross-platform photo editing experience, we want to redesign the homepage and increase the organic traffic more strategically by optimizing the website for SEO.
In this project, I worked with a front-end developer and a motion designer. I was responsible for designing the website and product management. I delivered the final design and visual and CSS animation while the motion designer cast a spell on the hero images and turned them into a motion graphic video.
I had to adapt the cross-office collaboration when working remotely. It took a lot of effort to communicate with the front-end developer and I had to get used to the different work culture. Secondly, this is my first product management experience. I need to deliver the product on time and ensure its quality.
The average visit duration is 1 min 48s which is increased by 50 seconds in less than a month. (2022/06/11) The bounce rate reduces by 12% (The original bounce rate was 51.58% in November last year, then it dropped to 39.57% in June 2022.)
PhotoGrid is a collage maker app to create stunning images for social media, like Instagram posts and stories, Facebook posts and covers, YouTube thumbnails, and Pinterest collections.
In 2021, PhotoGrid first time launched an online photo editing service. It’s an end-to-end photo collage product that empowers everyone to design and share their collages on social media. Not only available for free on the mobile, but also people can edit photos on the web and find delights in creating photo collages on this easy-to-use platform.
However, the online photo editor service didn’t go well because there was little information on the homepage and the site’s SEO was weak. Therefore, we started thinking about giving the homepage a new look to improve SEO and increase organic traffic.
Our research and product team identified 3 primary problems with the old homepage.
1. Lack of Information
There were only one caption and short description about the product.
2. Weak Brand Recognition
The whole visual was simple but it couldn't embody the core value of PhotoGrid.
3. Poor SEO
The team didn't put much work on optimizing SEO, so the search result ranking was uncompetitive.
We converted our key problems into opportunities to solve for during the redesign.
The goal of the project is:
Thus, we want to redesign the homepage and increase the organic traffic more strategically by optimizing the website for SEO. Before drawing wireframes, I felt we should do the user interview to understand users' needs and feedback on our product.
💁 User Interview Insight
Compared to other sites, PhotoGrid feels too plain and simple, and there’s a lack of information.
(User from HK / an excerpt from the user interview in Feb. 2022)
We learned that our homepage gave people a dull feeling, yet we want to do a makeover of the site to make it look delightful but also informative.
We had the software development team in Beijing and we needed to collaborate with them. In this collaborative project, I had to adapt to the cross-office collaboration when working remotely.
Secondly, this is my first product management experience. I need to deliver the product on time and ensure its quality.
Furthermore, our online editing feature was under construction so we don’t have many features to showcase on the online editing page. However, the team is gradually developing the infrastructure of the editing page, hoping one day we can catch up on all the features that we had on the app. In other words, we don’t have many features to promote or showcase on the homepage, so I had to select the most frequently used features on our site and persuade users there are still lots of cool things to try while creating collages.
In the hero section, we showcase the most frequently used features, layouts, background, and texts to catch users’ eyes. Also, we mentioned the cross-platform photo editing experience in the first section.
The following video is our hero section on the homepage. The amazing motion graphic gives credit to Rong Wu, one of our designers, for his great work. He brought my graphic work to life.
In the second section, I would like to emphasize our slogan, “Be fancy, So easy.”
In the third section, I use the tutorial to make belief a few clicks away from bringing memories alive and also to ignite inspiration. Therefore, I use a fairly persuasive tone here to communicate with users.
As for the fourth section, I would like to elaborate on the reasons for choosing PhotoGrid as users’ only photo-editing tool.
Finally, we include users’ reviews on the website to boost trust in our company and product.Since PhotoGrid is a 4.9-star App Store rating app, we use the excerpts from reviews, hoping to shorten the customers’ decision-making process. Furthermore, providing reviews on the website can improve SEO positioning.
According to the study, 82% of Americans say they consult online ratings and reviews when buying something for the first time and nearly half of Americans feel that user reviews help “a lot” to make them feel confident about their purchase.
Therefore, that’s why we put the review on the homepage because they are indeed a powerful and influential marketing tool.
PhotoGrid started as a photo editing and collage maker app, and over the years the team has grown up a lot last 10 years, with a robust photo/video editor and templates. We’ve empowered small business owners, KOLs, and so many users to create and express themselves with tons of grids and collages.
In 2021, the pandemic era, we’ve gained a lot of users and created many memories with them. We took some time to think about what’s the value to our users and what can we do more to ignite users’ creativity and improve the usability constantly.
With this in mind, we took a step back to think about the future and where we are headed as a company, and how our brand needed to adapt to support this vision. The team has been brainstorming for days and then we came up with the new slogan, “Be fancy, so easy,” because our users love glitter and glamour materials. This new slogan somewhat clearly set the tone of the PhotoGrid brand. With the new slogan, we spent a couple of weeks organizing the design guideline to adapt to the new slogan.
Based on the current design guideline, I added extended colors and marketing materials to highlight our brand voice.
To apply the voice and tone to the new homepage and advertising, I collected some keywords and visual elements, changing the outdated visual to get closer to the visual trend nowadays. In this way, I had a clearer vision to embody the brand voice.
The average visit duration is 1 min 48s which is increased by 50 seconds in less than a month. (2022/06/11) The bounce rate reduces by 12% (The original bounce rate was 51.58% in November last year, then it dropped to 39.57% in June 2022.)
In the process of redesigning PhotoGrid's homepage, we used the SEO checklist from Ahrefs to make sure we provide the best page experience with users. The following were what we did to improve our SEO and site performance:
From the redesign process of PhotoGrid’s homepage, I had a clearer vision of the brand voice because of the discussion and brainstorming session with team members.
The homepage refresh needed a lot of time, and as designers, it’s our responsibility to find mutual agreement with stakeholders. Throughout this process, I realized finding the brand voice and building an international product is never easy because a small tweak may make a big impact.
I was glad I had the chance to be a part of the website redesign journey, making the website and the PhotoGrid experience more consistent.
Lastly, I kept constantly finding a way to have effective communication through active listening and exchanging constructive and honest feedback. Then I overcame the frustration and struggle of collaborating with the China team.
We need to treat each design problem equally because each design experience embodies the meaning of design and design is all about building connections with users. And when we’re able to empathize with others, it’s easier to share the same vision with teammates.
Product Manager | Wen Lin
UIUX Designer | Wen Lin
Motion Designer | Rong Wu
Design Director | Jesse Chou