Framer Designer

📍 Job Overview

Job Title: Framer Designer
Company: Mochi Health
Location: San Francisco, CA
Job Type: Full-Time
Category: Digital Design & Development (with a focus on Marketing & GTM Operations)
Date Posted: January 27, 2026
Experience Level: 2-5 Years
Remote Status: On-site (5 days/week)

🚀 Role Summary

• Design and build high-performance, interactive websites and landing pages using Framer to drive user engagement and marketing funnel conversions.
• Ensure all digital web experiences maintain strict brand consistency and visual identity standards across all touchpoints.
• Optimize web pages for speed, SEO, and cross-device compatibility to deliver exceptional user experiences.
• Collaborate closely with marketing, product, and engineering teams to translate business objectives into compelling web solutions.
• Implement and analyze A/B tests to continuously iterate and improve conversion rates and user engagement metrics.

📝 Enhancement Note: While the job title is "Framer Designer," the responsibilities clearly indicate a role that bridges design and development, with a strong emphasis on marketing and growth initiatives. This role is crucial for Go-To-Market (GTM) operations by directly impacting lead generation and user acquisition through optimized web experiences. The "Builder" aspect implies a need for practical development skills within Framer, not just design conceptualization.

📈 Primary Responsibilities

• Web Design & Development: Conceptualize, design, and build responsive, interactive websites, landing pages, and potentially web application components within the Framer platform.
• Brand & Visual Identity Management: Ensure all web properties strictly adhere to Mochi Health's brand guidelines, visual identity, and design system standards.
• Performance Optimization: Develop web experiences optimized for fast loading times, search engine visibility (SEO), and seamless functionality across various browsers and devices.
• Cross-Functional Collaboration: Partner effectively with marketing teams to execute campaign strategies, product teams to align with feature launches, and engineering to ensure technical feasibility and integration.
• User Experience (UX) Enhancement: Design intuitive user flows and interactive elements that enhance user engagement and drive desired actions on the website.
• Conversion Rate Optimization (CRO): Design and implement A/B tests and other experiments to systematically improve conversion rates on key marketing pages.
• Content Integration & Management: Work with content creators to ensure seamless integration of copy and assets into Framer-built pages.
• Iterative Design & Feedback: Participate in design reviews, gather feedback, and iterate on web designs and functionalities to meet evolving business needs.

📝 Enhancement Note: The core responsibilities highlight a dual role: a designer who can also build. This is particularly relevant for GTM operations where speed and direct implementation are valued. The emphasis on conversion optimization and A/B testing directly links this design role to revenue-generating activities.

🎓 Skills & Qualifications

Education:

• Bachelor's degree in Design, Computer Science, Human-Computer Interaction, or a related field, or equivalent practical experience.

Experience:

• 2+ years of professional experience in web design and development, with a significant focus on building production websites.
• Proven experience designing and building functional websites and landing pages using Framer.

Required Skills:

• Framer Proficiency: Expert-level ability to design and build responsive, interactive websites and landing pages in Framer.
• Web Design Principles: Strong understanding of UI/UX principles, visual design, typography, and layout.
• Performance & SEO: Solid knowledge of web performance best practices, SEO fundamentals, and how to implement them within Framer.
• Conversion Optimization: Understanding of CRO principles and experience implementing A/B tests or other conversion-driving design patterns.
• Responsive Design: Demonstrated ability to create designs that adapt seamlessly across desktop, tablet, and mobile devices.
• Figma Proficiency: Skilled in using Figma for design conceptualization, wireframing, and creating assets, with the ability to work within existing design systems.
• Communication Skills: Excellent verbal and written communication skills, with the ability to clearly articulate design decisions and collaborate effectively with cross-functional teams.
• Detail Orientation: Meticulous attention to detail ensuring pixel-perfect execution and smooth interactions.

Preferred Skills:

• HTML/CSS: Foundational understanding of HTML and CSS, and the ability to leverage them within Framer for advanced styling or functionality.
• Basic JavaScript: Familiarity with basic JavaScript or a strong willingness to learn, for adding dynamic elements or custom interactions.
• Animation & Micro-interactions: Experience creating engaging animations and micro-interactions that enhance user experience without hindering performance.
• Marketing Funnel Understanding: Knowledge of marketing funnels, lead generation strategies, and how website design impacts these processes.
• Data Analysis: Ability to interpret A/B testing results and user analytics to inform design decisions.

📝 Enhancement Note: The emphasis on Framer as a primary tool, combined with the "Designer & Builder" requirement, suggests a candidate who can independently create and deploy web assets, reducing reliance on engineering for marketing site updates. This is a key operational efficiency for a GTM team.

📊 Process & Systems Portfolio Requirements

Portfolio Essentials:

• Live Framer Websites: A robust portfolio showcasing at least 2-3 production-ready websites or significant landing pages built entirely or primarily in Framer.
• Interactive Elements & Animations: Clear examples demonstrating the implementation of interactive components, smooth animations, and dynamic content within Framer.
• Responsive Design Examples: Visual or live demonstrations of how designs adapt and perform across different screen sizes (desktop, tablet, mobile).
• Conversion-Focused Design: Case studies or examples that highlight how your designs have contributed to specific conversion goals (e.g., lead generation, sign-ups, demo requests).
• Design Process Documentation: Showcase your thought process, from initial concept and wireframing (potentially in Figma) to final implementation in Framer, including any A/B testing or optimization efforts.

Process Documentation:

• Workflow Design: Examples of how you approach translating marketing campaign goals or product requirements into effective website structures and user flows.
• Implementation & Iteration: Demonstrate your process for building, testing, and iterating on web pages within Framer, including how you incorporate feedback and analytics.
• Performance & SEO Integration: Illustrate how you ensure performance and SEO best practices are integrated into your Framer development workflow from the outset.

📝 Enhancement Note: For a role focused on building and optimizing web experiences for GTM, a portfolio is critical. It needs to prove not just design aesthetic, but also functional implementation and impact on business metrics. Highlighting Framer projects specifically is non-negotiable.

💵 Compensation & Benefits

Salary Range:

• $100,000 - $130,000 USD per year.
• 📝 Enhancement Note: This salary range is competitive for a mid-level Designer/Developer role in San Francisco, CA, reflecting the high cost of living and the specialized skill set required for Framer development. The range accounts for variations in experience within the 2-5 year bracket and specific skill proficiencies. Research indicates that similar roles in the Bay Area typically fall within this range, particularly for companies known for offering strong equity and employee perks like Mochi Health.

Benefits:

• Comprehensive Health Coverage: Medical, dental, and vision insurance plans.
• Retirement Savings: 401(k) plan with employer match.
• Generous Time Off: Unlimited Paid Time Off (PTO), company holidays, and dedicated wellness days.
• Equity Package: Generous stock options to share in company success.
• Life Insurance: Standard life insurance coverage.
• Wellness Programs: Access to wellness initiatives, mindfulness sessions, and fitness perks.
• Daily Meals: On-site breakfast, lunch, and dinner provided.
• Espresso Bar: On-site barista for coffee and matcha.
• Commuter Benefits: Pre-tax commuter perks for transit and parking.
• Mochi Health Membership: Monthly subscription fee covered for employees to experience the company's service.

Working Hours:

• Full-Time, typically Monday through Friday, 9:00 a.m. to 7:00 p.m. (PST).
• 📝 Enhancement Note: The stated working hours (9 AM - 7 PM) are quite long for a standard 40-hour work week, suggesting potential for extended project deadlines or a culture that values significant dedication. However, the "Unlimited PTO" and "true flexibility" mentioned in the "Life at Mochi" section might imply a focus on output rather than strict hours, but candidates should clarify this expectation.

🎯 Team & Company Context

🏢 Company Culture

Industry: Healthcare Technology (Digital Health) Company Size: Growing startup, likely between 50-200 employees based on typical growth trajectories for companies with rapid growth and significant funding. Founded: The description implies recent growth, suggesting a company founded within the last 5-10 years.

Team Structure:

• Design Team: This role reports to the Head of Design, indicating a structured design department.
• Cross-Functional Collaboration: The role demands close collaboration with Marketing, Product Management, and Engineering teams, reflecting a typical startup environment where interdepartmental synergy is key for rapid iteration and execution.
• Specialization: The team likely comprises specialists in various areas of healthcare, technology, and product development, with Mochi Health aiming to attract top talent from diverse backgrounds.

Methodology:

• Data-Driven Decisions: Emphasis on A/B testing and performance metrics indicates a data-driven approach to web development and marketing.
• Agile Development: The need for rapid iteration and collaboration suggests an agile or lean methodology for web development and campaign execution.
• User-Centric Design: The mission to improve healthcare accessibility and patient experience points to a strong user-centric design philosophy.

Company Website: joinmochi.com

📝 Enhancement Note: Mochi Health positions itself as an innovative player in the digital healthcare space, focusing on patient empowerment through technology. The culture appears to value excellence, collaboration, and impact, drawing talent from top-tier companies and institutions.

📈 Career & Growth Analysis

Operations Career Level: This role is positioned as a mid-level individual contributor, bridging design and front-end development for marketing and GTM functions. It's a hands-on role where execution is paramount.

Reporting Structure: Reports directly to the Head of Design, indicating a clear line of management and potential for mentorship from a senior design leader.

Operations Impact: The Framer Designer directly impacts Mochi Health's Go-To-Market (GTM) strategy by building and optimizing the digital front doors (websites, landing pages) that attract, engage, and convert potential users and patients. Their work is crucial for lead generation, brand perception, and the overall effectiveness of marketing campaigns.

Growth Opportunities:

• Skill Specialization: Deepen expertise in Framer, advanced web interactions, and conversion rate optimization.
• Cross-Functional Exposure: Gain a deeper understanding of marketing strategy, product development cycles, and engineering constraints.
• Leadership Potential: With proven impact, potential to grow into a Senior Framer Designer, Lead Web Designer, or even transition into a Product Design or Marketing Operations role that leverages their web development skills.
• Industry Expertise: Develop specialized knowledge in the rapidly evolving digital health sector.

📝 Enhancement Note: This role offers a clear path for growth within a specialized design-and-build function, particularly valuable in a growth-stage company where efficient digital presence is key. The opportunity to influence GTM strategy through direct web development is significant.

🌐 Work Environment

Office Type: In-person, collaborative office environment located in Downtown San Francisco, CA. Office Location(s): San Francisco, CA headquarters, described as "just steps from BART, Muni, and great food," emphasizing accessibility and convenience for commuters.

Workspace Context:

• Collaborative Hub: The office is designed for both "deep work" and "casual collaboration," suggesting a mix of focused individual spaces and open areas for team interaction.
• On-site Amenities: Features a stocked kitchen, daily meals, and an on-site barista, creating a supportive and engaging work atmosphere.
• Technology: While not explicitly stated for this role, the company culture suggests access to modern design and development tools.

Work Schedule:

• Expected to work on-site five days a week.
• Standard schedule is Monday through Friday, 9:00 a.m. to 7:00 p.m. (PST).
• 📝 Enhancement Note: The long daily hours (10 hours) for a 5-day week suggest a demanding but potentially rewarding work environment. Candidates should clarify expectations around flexibility and work-life balance, especially given the "Unlimited PTO" and "true flexibility" mentioned elsewhere.

📄 Application & Portfolio Review Process

Interview Process:

• Initial Screening: A brief call with HR or a recruiter to assess basic qualifications and cultural fit.
• Portfolio Review & Technical Interview: A session with the Head of Design and potentially other design/marketing team members to deeply review your Framer portfolio and discuss your design and development process. Expect technical questions about Framer capabilities, responsive design, performance, and SEO implementation.
• Cross-Functional Interview: An interview with stakeholders from Marketing and/or Product to assess collaboration skills, understanding of GTM objectives, and ability to translate business needs into web solutions.
• Final Interview: Potentially with a senior leader to discuss overall fit, career aspirations, and confirm alignment with company values.

Portfolio Review Tips:

• Highlight Framer Expertise: Ensure your portfolio prominently features your work built in Framer. For each project, clearly state your role, the tools used (especially Framer), and the key outcomes.
• Showcase Impact: Quantify results where possible. If a landing page you built increased conversion rates by X%, or improved page load speed by Y seconds, highlight it.
• Demonstrate Process: Walk through your design and build process for 1-2 key projects. Explain your problem-solving approach, how you handled challenges, and your iteration strategies.
• Interactive Elements: Be prepared to demonstrate interactive features, animations, and responsive design adjustments live or through video.
• Brand Consistency: Explain how you maintained brand consistency and worked within design systems.

Challenge Preparation:

• Framer Challenge: Be prepared for a practical exercise, potentially involving building a small component or landing page in Framer, or a design challenge that requires you to outline how you would approach a specific web development task for Mochi Health.
• Scenario-Based Questions: Prepare for questions like: "How would you design a landing page for a new product launch?" or "How would you optimize an existing page for better SEO?"
• Collaboration Scenarios: Think about how you would collaborate with marketers to understand campaign goals or with engineers on technical constraints.

📝 Enhancement Note: The interview process will heavily scrutinize practical Framer skills and the ability to deliver tangible results for marketing initiatives. A strong, well-documented portfolio is the most critical component of the application.

🛠 Tools & Technology Stack

Primary Tools:

• Framer: The core platform for designing and building websites and landing pages. Deep proficiency is essential.
• Figma: Used for design conceptualization, wireframing, prototyping, and asset creation. Ability to work within and contribute to design systems is key.

Analytics & Reporting:

• Web Analytics Tools: (Likely Google Analytics, or similar) for tracking user behavior, traffic sources, and conversion metrics.
• A/B Testing Tools: (e.g., Google Optimize, Optimizely, or Framer's built-in capabilities) for experimental design and performance analysis.

CRM & Automation:

• CRM: While not directly used for building, understanding how website interactions feed into CRM systems (e.g., Salesforce, HubSpot) is beneficial.
• Marketing Automation Platforms: Familiarity with how marketing automation tools integrate with web forms and landing pages.

Other Potential Tools:

• HTML/CSS: Foundational knowledge for web development.
• Basic JavaScript: For adding dynamic functionality.

📝 Enhancement Note: This role is highly specialized around Framer. While general design and web development skills are important, deep, practical expertise in Framer is the primary technical requirement.

👥 Team Culture & Values

Operations Values:

• Excellence & Humility: A drive for high-quality work combined with a collaborative and approachable attitude.
• Empathy: Particularly relevant in a healthcare context, understanding the needs of patients, providers, and colleagues.
• Bold Thinking & Innovation: Encouraging creative solutions and pushing boundaries in digital healthcare.
• Data-Driven Approach: Utilizing metrics and analytics to inform decisions and measure impact.
• Efficiency & Speed: Valuing the ability to execute quickly and effectively, especially in a startup environment.

Collaboration Style:

• Cross-Functional Integration: Actively working with diverse teams (Marketing, Product, Engineering) to achieve shared goals.
• Open Communication: Encouraging direct and honest feedback, with an emphasis on constructive dialogue.
• Shared Ownership: Fostering a sense of collective responsibility for the success of projects and the company.

📝 Enhancement Note: Mochi Health appears to cultivate a high-performance, mission-driven culture that balances ambition with a supportive and collaborative environment. The emphasis on learning from top talent suggests a strong commitment to professional development and knowledge sharing.

⚡ Challenges & Growth Opportunities

Challenges:

• Rapid Iteration in a Startup: The fast-paced nature of a startup requires quick adaptation, continuous learning, and the ability to manage multiple projects simultaneously.
• Balancing Design Aesthetics with Performance: Designing visually appealing and interactive experiences while ensuring optimal web performance and SEO can be a constant challenge.
• Translating Complex Healthcare Concepts: Effectively communicating the value of Mochi Health's services through web design to a diverse audience.
• Staying Ahead of Framer Updates: Keeping pace with the evolving features and best practices of the Framer platform.

Learning & Development Opportunities:

• Deepen Framer Expertise: Become a go-to expert for Framer within the company, potentially leading to advanced roles.
• Master Conversion Optimization: Develop sophisticated CRO strategies and gain experience with advanced testing methodologies.
• Contribute to GTM Strategy: Influence the direction of marketing campaigns and product launches through direct web development contributions.
• Industry Exposure: Learn about the nuances of the digital healthcare market and patient-centric technology.
• Mentorship: Opportunities to learn from the Head of Design and experienced professionals from top tech companies.

📝 Enhancement Note: This role offers significant opportunities to grow within a specialized niche (Framer) while contributing directly to the operational success of a growing healthcare tech company. The challenges are typical of a startup environment but come with substantial rewards in terms of learning and impact.

💡 Interview Preparation

Strategy Questions:

• "How would you approach designing and building a new landing page for a specific marketing campaign targeting [e.g., chronic disease patients]?" (Focus on process, Framer implementation, and conversion goals.)
• "Describe a time you used A/B testing to improve a website's performance or conversion rate. What was your process and what were the results?" (Highlight analytical thinking and iterative design.)
• "How do you ensure brand consistency across different web projects, especially when working with existing design systems?" (Focus on attention to detail and adherence to guidelines.)
• "What are the key considerations for optimizing a website for SEO and performance within Framer?" (Demonstrate technical understanding of web best practices.)

Company & Culture Questions:

• "What excites you about Mochi Health's mission to improve healthcare accessibility?" (Show genuine interest in the company's purpose.)
• "How do you approach collaboration with non-designers, such as marketers or product managers?" (Illustrate teamwork and communication skills.)
• "How do you stay updated on new design trends and technologies, particularly within Framer?" (Show proactive learning and passion for the field.)

Portfolio Presentation Strategy:

• Structure is Key: Organize your portfolio to clearly showcase your Framer projects first. For each, have a brief overview, your specific contributions, the problem you solved, your solution (with visual examples), and the outcome/impact.
• Live Demo Ready: Be prepared to share your screen and demo key interactive features or responsive adjustments within Framer for one or two of your strongest projects.
• Quantify Impact: Wherever possible, use data (conversion rates, load times, engagement metrics) to support the success of your work.
• Explain Your "Why": For each design decision, be ready to explain the rationale behind it, linking it back to user needs or business objectives.

📝 Enhancement Note: Be prepared to demonstrate not just your design eye, but your ability to build effective, conversion-driven web experiences in Framer. The interview will likely involve practical assessments, so practicing Framer builds and portfolio walkthroughs is crucial.

📌 Application Steps

To apply for this Framer Designer position:

• Submit Your Application: Complete the application form via the provided link on Greenhouse.
• Curate Your Portfolio: Ensure your portfolio prominently features your best Framer projects. Prioritize examples that demonstrate responsive design, interactive elements, and a direct impact on conversion goals. If possible, include a brief case study for your strongest Framer project.
• Tailor Your Resume: Highlight your 2+ years of experience in web design and development, specifically mentioning Framer proficiency and any experience with SEO, performance optimization, and A/B testing. Use keywords from the job description.
• Prepare Your Framer Demo: Practice walking through your Framer projects, be ready to explain your design process, and demonstrate interactive features live.
• Research Mochi Health: Understand their mission, target audience, current website, and company values to tailor your responses and demonstrate genuine interest.

⚠️ Important Notice: This enhanced job description includes AI-generated insights and operations industry-standard assumptions. All details should be verified directly with the hiring organization before making application decisions.