TempAI
A new generative AI-powered chatbot that creates personalized collage templates.
PROCESS HIGHLIGHTS
Design challenge & responsibilities overview
Challenge
Needed to go beyond PicCollage's core functionality to enhance user retention and engagement while staying competitive.
Opportunity
By integrating AI-driven customization, we streamline the template selection process, reduce user frustration, and create a more personalized and engaging experience.
Project Type
Personal Project
Role
Project Manager
UX Designer
UX Researcher​
Contribution
Survey Design
Competitor Analysis
UX Design
Interaction Design
Product Strategy
Project Management
Team
Christine Chen
Andrea Li
Angela He
Linda Tsai
Vera Hu
Wendy Hsu
Tools
Figma
Timeline
5 Weeks
Oct. - Nov. 2024
BACKGROUND
Design Challenge for PicCollage
PicCollage is a leading photo collage app, offering diverse templates for various occasions and helping users create and share memories effortlessly. As a mature product, the app aims to retain users and stay competitive.
For this design challenge, we tackled the HMW: How can PicCollage go beyond a collage tool to enhance user engagement and value? To address this, I proposed TempAI, an AI-powered feature that elevates user experience.
BACKGROUND
My Role & Responsibilities
As Project Manager and UX Designer, I led the development of TempAI from concept to high-fidelity design.
-
Project Management: Oversaw the design process, assigned tasks, tracked progress, set milestones, and guided the team through challenges.
-
UX Design: Defined product strategy, created user flows, designed interactions, and built high-fidelity prototypes.
-
User Research: Conducted competitor analysis, led survey design, and interviewed app users.
RESEARCH
Desk Research
Our team began with desk research to analyze competitors and identify gaps in PicCollage’s offerings. I was responsible for researching PhotoGrid, examining its business model, key features, and target audience. I conducted a SWOT analysis, and the most significant findings was that PicCollage lacked AI-driven features, presenting a key opportunity to enhance user experience and maintain competitiveness.
RESEARCH
User Survey & Agile Strategy Adaption
To better understand user behaviors, motivations, and perceptions of AI, I started designed the user survey. Given PicCollage’s broad user base, the survey was initially structured with English and Mandarin in a single version. However, after receiving only 12 responses in three days, it became clear that my approach needed refinement.
To improve participation, I split the survey into two separate versions and targeted distribution through language-specific Facebook groups. While waiting for more survey data, I led brainstorming sessions first to generate feature ideas based on initial research insights and PicCollage’s product vision. I then later incorporated concept validation questions to gather user interest in potential new features. The changes I made significantly increased engagement, leading to over 300 responses in just two days.
​
The survey findings highlighted key user pain points:​​
1. Poor template categorization made it difficult for users to find suitable designs.
2. Limited customizability forced users to settle for templates that didn’t fully match their needs.
IDEATE
Concept Development
Based on research insights and my personal experience with PicCollage, I proposed TempAI, an AI chatbot that generates template recommendations based on user preferences. During our team brainstorming session, my idea stood out for its innovation, viability, alignment with business goal, and competitive advantage.
​
Testing our concepts via survey, the responses validated high demand for TempAI, as the most preferred concept among survey participants. Additionally, user interviews provided further positive feedback, confirming its potential value.
With strong research backing and stakeholder alignment, TempAI was chosen as our primary concept, leading us into the design phase.
IDEATE
User Flow Diagram
I crafted a user flow for TempAI to illustrate the paths users may take when navigating the app, highlighting potential scenarios they might encounter along the way.
IDEATE
Mid-Fidelity Prototype
Following the creation of the flow chart, I proceeded to sketch mid-fidelity wireframes as preliminary steps to identify improvements. This helped refine how the features would come together on screen.
ITERATE
User Testing & Iteration
Due to time constraints, I created a high-fidelity prototype using Figma for user testing, and two major issues were identified:
-
Issue 1: Accidentally clicking TempAI when users wanted to select photos.
-
Suggested Change: Move TempAI to the bar along with other features.
-
Issue 2: Users were unsure of where to ask AI to generate templates.
-
Suggested Change: Instead of putting the “Generate” button as an option, I added a new button to make it clearer that users have finished their inputs.
DESIGN
Final Product
After resolving the usability issues, the final design of TempAI effectively addressed users' needs by providing AI-generated templates and allowed users to easily edited on the Edit Page. It minimized the learning curve by guiding users in entering their preferences through intuitive prompts, while also improving efficiency by using generative AI to produce templates tailored to those preferences.
REFLECT
Conclusion
This project was a valuable learning experience that taught me the importance of being agile and adaptable. Throughout the process, I learned to pivot quickly and adjust to new insights, especially when challenges arose. I also realized the value of seeking advice from others to refine my ideas and improve the design. This project helped me hone my skills in interaction design and further develop my overall UX design expertise. Most importantly, I discovered my passion for collaborating with others, and I truly enjoyed working together to bring the product to life.​