ChatGPT-powered feature for social media post creation
How a GPT-powered feature streamline post creation process?
ChatGPT-powered feature for social media post creation
How a GPT-powered feature streamline post creation process?
ChatGPT-powered feature for social media post creation
How a GPT-powered feature streamline post creation process?
ROLE
Product Designer
ENVIRONMENT
Remote
Cross 3 time zones
TOOLS
TIMELINE
8 Weeks
TEAMS
Developer/Client
PM
Design
Tools
ROLE
Product Designer
ENVIRONMENT
Remote
Cross 3 time zones
TOOLS
TIMELINE
8 Weeks
TEAMS
Developer/Client
PM
Design
Tools
ROLE
Product Designer
ENVIRONMENT
Remote
Cross 3 time zones
TOOLS
TIMELINE
8 Weeks
TEAMS
Developer/Client
PM
Design
Tools
Overview
Overview
Contentpal (now Extropost) is an AI-powered social media management web app, focusing on helping professionals improve their career growth through a consistent social media presence.
Contentpal (now Extropost) is an AI-powered social media management web app, focusing on helping professionals improve their career growth through a consistent social media presence.
Goal
Goal
🎯
🎯
Assist career-focused content creators to create text-heavy content with ease and efficiency.
Assist career-focused content creators to create text-heavy content with ease and efficiency.
Problem
Problem
😥
😥
Professionals want to maintain their social media presence to level up their career, but struggling to create posts and post consistently because of busy schedules and lifestyle.
Professionals want to maintain their social media presence to level up their career, but struggling to create posts and post consistently because of busy schedules and lifestyle.
Role & responsibility
Role & responsibility
Planned and facilitated meetings and sprints.
Planned and facilitated meetings
and sprints.
Roadmap planning.
Rapid prototyping and mockups.
Planned and conducted analysis, user research, moderated & unmoderated user testing.
Planned and conducted analysis, user research, moderated & unmoderated user testing.
Communication with stakeholders and align team visions
Designed and iterated the product based on user insights.
Designed and iterated the product based on user insights.
Impact
Impact
💜
💜
💜
Designed the AI post creation feature, led to 100% preference rate over competitors from users.
Designed the AI post creation feature, led to 100% preference rate over competitors from users.
💰
💰
💰
Redefined target users that brought profit potential up by 60%.
Redefined target users that brought profit potential up by 60%.
🎨
🎨
🎨
Established design system, increased development efficiency by 40%.
Established design system, increased development efficiency by 40%.
⚠️
⚠️
⚠️
Discovered problems and risks, identified and prioritized opportunities.
Discovered problems and risks, identified and prioritized opportunities.
Role & responsibility
Planned and facilitated meetings and sprints.
Roadmap planning.
Rapid prototyping and mockups.
Planned and conducted analysis, user research, moderated & unmoderated user testing.
Designed and iterated the product based on user insights.
🎨 Designed and iterated the product based on user insights.
CHALLENGE
CHALLENGE
Understand how ChatGPT's API works
Understand how ChatGPT's API works
With ChatGPT's API being the tool we wanted to utilize, it's important to understand how it works. The challenging part is to design within the limit and make the process easier and guide the users to enter prompts that will more likely lead to relevant results. To be able to design, I spent quite some time interacting with GPT tools, researching the API and communicating with the developer to understand how it can work and how it will react to users' prompt. And that led us to what I came up with.
Make client understand their needs are not the users' needs
Make client understand their needs are not the users' needs
The client started the project with a solution in mind and assumed that will be what users need. When presenting the research results, they tend to only take the part that aligned with their assumption and ignore other important insights. Although, this problem was persistent, I found a way that works better to communicate with them. That is, through presenting the user insights in different ways with analysis to back up the statement, also experimenting with different communication styles. After a while, I finally found ways that work to communicate with them and gained more trust during the process.
TARGET USERS
TARGET USERS
Career focused individual content creators
Career focused individual content creators
“I need to maintain my LinkedIn presence to grow my career”
🥺 Wants to gain more followers to have more influence.
😥 Busy at work, doesn't have much time for content creation.
😭 Struggle to post regularly.
😢 No time to come up with content for different social media platform.
🧐 Wondering how to make content creation more efficient.
“I need to maintain my LinkedIn presence to grow my career”
🥺 Wants to gain more followers to have
more influence.
😥 Busy at work, doesn't have much
time for content creation.
😭 Struggle to post regularly.
😢 No time to come up with content for
different social media platform.
🧐 Wondering how to make content
creation more efficient.
DISCOVER
DISCOVER
Users frustrated with competitors' AI features
Users frustrated with competitors' AI features
I delved into how competitors like Socialbee, Publer, and Jasper use AI to assist post creation. I had some assumptions about how users might use the features. To validate these, I conducted competitive usability testing. In five sessions, asking participants used Socialbee and Publer to prepare and create posts with AI features. The goal was to see how content creators interact with these tools and gather firsthand insights for our product.
I delved into how competitors like Socialbee, Publer, and Jasper use AI to assist post creation. I had some assumptions about how users might use the features. To validate these, I conducted competitive usability testing. In five sessions, asking participants used Socialbee and Publer to prepare and create posts with AI features. The goal was to see how content creators interact with these tools and gather firsthand insights for our product.
⚠️
⚠️
⚠️
All participants expressed frustrations with Social Bee and Publer's AI feature. And stated that they don't want to use these in their workflow.
All participants expressed frustrations with Social Bee and Publer's AI feature. And stated that they don't want to use these in their workflow.
DEFINE
DEFINE
Key pain points from competitors' features
Key pain points from competitors' features
🤔 Users entered not detailed enough prompts and got irrelevant post results.
🤔 Users entered not detailed
enough prompts and got
irrelevant post results.
😫 Users were frustrated because they couldn't iterate and improve the generated results.
😫 Users were frustrated because they couldn't iterate and improve the
generated results.
😫 Users were frustrated because
they couldn't iterate and improve
the generated results.
😰 Users were overwhelmed by the interface.
😰 Users were overwhelmed by the
interface.
DEVELOPE
DEVELOPE
Design an AI feature with guided prompts & enabling post results iteration
Design an AI feature with guided prompts & enabling post results iteration
With these insights in mind, I started the design for the features. First, I tried to figure out how to use GPT to get ideal and relevant post results. What will users have to enter to get ideal results? Then the feature will also enable users to iterate and improve the results and add to the post. I came up with mid-fi wireframes for proposing the idea to the stakeholders.
With these insights in mind, I started the design for the features. First, I tried to figure out how to use GPT to get ideal and relevant post results. What will users have to enter to get ideal results? Then the feature will also enable users to iterate and improve the results and add to the post. I came up with mid-fi wireframes for proposing the idea to the stakeholders.
Direction validation and refinement
Direction validation and refinement
The idea was well received. After incorporating feedback from two fellow designers, I developed a mid-fi prototype for a moderated testing session with five LinkedIn content creators.
The idea was well received. After incorporating feedback from two fellow designers, I developed a mid-fi prototype for a moderated testing session with five LinkedIn content creators.
The results were encouraging, suggesting we were on the right path with our product direction.
The results were encouraging, suggesting we were on the right path with our product direction.
💜 Users found the feature easy to use and navigate.
💜 Users found the feature easy to
use and navigate.
💜 There was excitement for a product catering to career-focus content creation.
💜 There was excitement for a
product catering to career-focus
content creation.
💜 All participants showed interest in incorporating this feature into their workflow
💜 All participants showed interest in
incorporating this feature into
their workflow
I identified these key insights for improvement:
To refine the feature, I identified these key insights for improvement:
To refine the feature, I identified these key insights for improvement:
😥 Users preferred using desktops for content creation, differed from the mobile-first approach,
influenced by initial target users (Instagram).
😥 Users preferred using desktops for content creation, differed from the mobile-first
approach, influenced by initial target users (Instagram).
😥 Users preferred using desktops
for content creation, differed from
the mobile-first approach,
influenced by initial target users
(Instagram).
😥 Users had a hard time to mentally tracking the progression of the generation, due to frequent page
changes.
😥 Users had a hard time to mentally tracking the progression of the generation, due
to frequent page changes.
😥 Users had a hard time to mentally
tracking the progression of the
generation, due to frequent page
changes.
😥 Users wanted to edit results before adding into the post.
😥 Users wanted to edit results
before adding into the post.
😥 Users wanted to access past prompts and results for continuing the process later or reusing the
materials.
😥 Users wanted to access past prompts and results for continuing the process later or
reusing the materials.
😥 Users wanted to access past
prompts and results for continuing
the process later or reusing the
materials.
RESULTS
RESULTS
Guided form for more relevant results
Guided form for more relevant results
Choose platform to make results that match the restrictions of each platform
Choose platform to make results that match the restrictions of each platform.
Guiding users to enter more ideal post details for better results
Guiding users to enter more
ideal post details for better
results.
Access to all past prompts and results
Access to all past prompts and results
Enable users to search keywords to find past results with ease.
Enable users to search keywords to find past results at ease.
Platform icon indicates what the platform the post results were for.
Platform icon indicates what the platform the post results were for.
Improve results
Improve results
Enable users to improve results or select the ideal result(s) to improve upon.
Enable users to improve results or select the ideal result(s) to improve upon.
Horizontal scroll for post results to avoid long text overflow the viewpoints, which could be difficult to view and compare results.
Horizontal scroll for post results to avoid long text overflow the viewpoints, which could be difficult to view and compare results.
Edit & add to post
Edit & add to post
Add to post directly.
Add to post directly.
Click the pen icon to edit results.
Click the pen icon to edit results.
Users can also undo the previous edits.
User can also undo the previous edits.
Grey out clickable components and remove the checkbox to indicate the edit mode.
Grey out clickable components and remove the checkbox to indicate the edit mode.
All generated progress on one page
All generated progress on one page
Conversational but with structure.
Conversational but with structure.
Help users to mentally track the progress and compare results at east.
Help users to mentally track the progress and compare results at east.
Color shade on the top and bottom of the scroll area to smooth the transition and add depth visually.
Color shade on the top and bottom of the scroll area to smooth the transition and add depth visually.
💜
💜
All testers prefer the feature over competitors'
All testers prefer the feature over competitors'
📈
📈
Increased beta sign up rate by 20%
Increased beta sign up rate by 20%
🙌🏼
🙌🏼
Increased user interests by 60%
Increased user interests by 60%
Next steps
Next steps
This is a big relief to have found the target users who match the interest of the client's goal. The developer has started the development section as we have handed off the design. The next priority for us will be…
This is a big relief to have found the target users who match the interest of the client's goal. The developer has started the development section as we have handed off the design. The next priority for us will be…
🧠 AI features for proofread, translation, repurpose posts and adjusting posts for different platforms.
🧠 AI features for proofread, translation, repurpose posts and adjusting posts for
different platforms.
🧠 AI features for proofread, translation,
repurpose posts and adjusting posts
for different platforms.
🧵 Explore how to tailor the features more for career-focused content creators.
🧵 Explore how to tailor the features
more for career-focused content
creators.
🧪 Continue testing along the way.
🧪 Continue testing along the way.
I am very excited to see how this product will grow into and can't wait for it to be released.
I am very excited to see how this product will grow into and can't wait for it to be released.
TAKEAWAYS
TAKEAWAYS
Always validate the ask first
Always validate the ask first
I learn that it's important to always validate the ask from the client or stakeholders before action. And ask good questions to really understand what their true needs and problems are. Not just take the proposed solution.
I learn that it's important to always validate the ask from the client or stakeholders before action. And ask good questions to really understand what their true needs and problems are. Not just take the proposed solution.
Accurate user research methods
Accurate user research methods
Inaccurate user research is worse than no user research. I didn't run the initial survey. But I should have looked into it more and stepped in from the start. I learned that when running a survey, we have to be cautious about where it is distributed to. And do more foundational research beforehand. And be strategic with who we are getting the insights from.
It's also important to guide the stakeholders to look at the results in the right way and not being bias. Advocate for what is the true insights instead of what they want to see.
Inaccurate user research is worse than no user research. I didn't run the initial survey. But I should have looked into it more and stepped in from the start. I learned that when running a survey, we have to be cautious about where it is distributed to. And do more foundational research beforehand. And be strategic with who we are getting the insights from.
It's also important to guide the stakeholders to look at the results in the right way and not being bias. Advocate for what is the true insights instead of what they want to see.