Figma - Deep Dive: Designing for growth (FigJam case study) | Figma
The project aimed to highlight the benefits of Fig Jam's pro plan in a non-intrusive way. The team conducted various experiments, with the most successful involving a subtle 'nudge' animation to inform users about the pro plan features like unlimited files, voting, and open sessions. This approach was designed to be informative without overwhelming users, maintaining a balance between promoting the pro plan and preserving the free user experience. The team also focused on using engaging and humorous copywriting to convey the value of the pro plan, aligning with Fig Jam's playful brand tone. They ensured that the animations and messages were not shown too frequently to avoid user fatigue, especially for new users who might not yet appreciate the full value of the pro features.
Key Points:
- The project used subtle animations to promote pro plan features without disrupting user workflow.
- Experiments focused on highlighting key pro features like unlimited files and voting.
- Copywriting played a crucial role, using humor and engaging language to convey value.
- User fatigue was minimized by controlling the frequency of promotional messages.
- The project maintained Fig Jam's playful tone while effectively communicating the benefits of upgrading.
Details:
1. 🎥 Welcome to Figma's Design Journey
1.1. Introduction and Strategic Approach
1.2. Experimentation and Outcomes
2. 🚀 Unveiling Successful Experiments
- The Growth Design Project aimed to find product-market fit for FigJam, Figma's second new product, particularly as a whiteboarding tool.
- Features developed included audio conversations, music, and open sessions, with differentiation through various plan tiers.
- The FigJam Pro plan was priced affordably at $3 or $4, depending on location, making it cheaper than Figma plans.
- The objective was to seamlessly integrate the paid plan's value into the user's workflow without being intrusive.
- The project successfully showcased the value of paid features, contributing to an enhanced user experience.
3. 🧩 Crafting User Experience with Innovation
- A focused experiment was conducted to nudge free users towards the pro plan by showcasing its value through bespoke animations.
- Key features of the pro plan, such as audio conversations, voting, and additional pages, were highlighted.
- Innovative visual metaphors and skeuomorphism were used instead of standard tooltips or banners to convey value without overwhelming users.
- The nudge strategy specifically targeted file usage limits, encouraging users to upgrade for uninterrupted workflow.
- The hypothesis suggested that file usage limitations drive user conversion to the pro plan.
- Pro plan pricing was strategically positioned as affordable compared to the full Figma suite pricing to attract upgrades.
- Animations emphasized core pro features such as unlimited files, voting, and open sessions.
- Voting and open sessions were presented as essential facilitator tools within the Fig Jam Pro offering, enhancing user engagement.
- Users could participate in voting activities without requiring sign-up, increasing accessibility and engagement.
4. 🔧 Balancing Usability and Creativity
- The company maintains a casual and fun tone in interface design, strategically avoiding intrusive elements like large banners or pop-ups to enhance user experience.
- Tooltips were minimized in size and presence to prevent workflow disruption, considering users engage with the interface for up to 8 hours a day.
- Lightweight indicators, such as ephemeral messages, are employed to inform users about their status efficiently without needing interaction, preserving screen space for optimal workflow.
- In instances requiring a call-to-action, like reaching free file limits, direct communication encourages upgrades, balancing user engagement with business goals.
- Design conservatively uses screen space, crucial for smaller screens, enhancing workflow without overcrowding the interface.
- Visual components like steppers effectively indicate user status (e.g., "1 of 3 files used") without occupying excessive screen space.
- Upselling features, such as open sessions and voting, are introduced once upgrade intent is shown, with detailed information provided only post-upgrade intent to maintain focus on user needs.
5. 🌀 Iterations and Valuable Feedback
- The experiment with open sessions, where two visitors could collaborate, was successful.
- To find the balance of not annoying users with frequent animations, a complex series of heuristics was used.
- Users should not see animations more than once a week to prevent fatigue.
- New users are not shown the animation to preserve their learning experience.
- The animation strategy considers user engagement level and account activity, avoiding showing animations if users are already engaged in other tasks.
6. ✍️ Engaging Copy and Communication
- The copywriting and content strategy effectively enhances user experience, with UX writer Julia playing a significant role in incorporating engaging language into the product.
- A strategic communication approach highlights features such as facilitation session voting to make users aware of key functionalities, enhancing their experience.
- Humorous and light-hearted language, like calling font sizes 'ginormous,' creates a fun and approachable user interface, differentiating the product.
- The UX writing team, including Schmidt, has established a unique, enjoyable style in Fig Jam, adding to the product's appeal with fun language choices.
- These strategic language choices contribute to a delightful and approachable product perception, enhancing user experience.
7. 🎯 Final Design Alignment and Reflections
- Conducted a series of experiments with multiple hypotheses to ensure a thorough testing approach, reflecting a strategic and flexible design process.
- Iterated through various design versions, including those liked but not shipped, demonstrating adaptability and a willingness to explore beyond initial ideas.
- The final shipped design, which became favored, was initially not the primary choice, showcasing the team's adaptability and openness to change.
- Prioritized dynamic features such as voting, open sessions, and audio conversations to create an engaging and lively UI, emphasizing user interaction.
- Considered bespoke solutions for UI components, highlighting a commitment to delivering tailored user experiences that go beyond standard components.
- Achieved alignment and support within the team for the final launch, underscoring the importance of consensus and collaborative decision-making in the design process.