COTTAGE
Designing a new onboarding flow for startup clients and refreshing the landing page for a developer-focused freelancing platform
Client
Cottage
My Role
Lead UX/UI Designer
Led design efforts across the project while collaborating with a small team of designers, developers, and the founder. I was responsible for research, experience strategy, wireframes, UI design, and communicating with cross-functional stakeholders.
Duration
4 weeks
Methods and tools
User Interviews, Heuristic Evaluation, Competitive Analysis, User Personas, User Flows, Wireframing, UI Design, Prototyping, Usability Testing, Design Documentation.
Tools: Figma, Miro, Asana, Notion, GitHub, Google Meet
Overview
Cottage is a freelance platform that connects early-stage startups with junior software engineers for short-term development tasks. While the developer experience was partially in place, the startup-side onboarding had not yet been designed. I worked closely with the founder, other designers, and developers to define and build an intuitive onboarding experience from scratch. In addition, I led the redesign of the platform’s landing page to better communicate its unique value and convert more startup clients.
The Problem
Startup clients were excited to use Cottage but couldn’t onboard themselves; the process required manual setup by the CEO, which wasn’t scalable and caused delays.
The Solution
In collaboration with three other designers, we created a self-serve onboarding flow through the Cottage GitHub plugin, allowing clients with some technical background to independently post tasks, manage submissions, and invite teammates.
We followed a design thinking approach, combining user interviews and testing feedback to guide an iterative design process and ensure usability from day one.
What technical steps must a customer complete to get up and running with Cottage?
Create a Cottage account
Ensure their source code is stored in GitHub
Import code from GitHub into Cottage's cloud-based IDE
Provide variables and initialization code for Cottage
Set up billing via the Stripe payment system
User Interviews
Key Takeaways
A major challenge for non-technical founders is understanding what to request when hiring freelancers.
Concerns about security and intellectual property (especially around permissions and sensitive data) are common.
The web-based IDE is a unique selling point, but users need clearer instructions on how it works.
Trustworthiness and quality of work are top priorities for potential clients.
Competitive Analysis
Key Takeaways
All competitors have an onboarding experience for users.
Competitors support freelance work across multiple industries.
Each platform fosters a community space for learning and collaboration.
Educational resources are present across all competitors’ websites.
The Persona
Alex , Devs Team Lead
“The team and I have a lot on our plate, we need a talented freelancer to come on board and help us out with some of the smaller tasks, so we can focus on the more prominent ones.”
Alex needs to:
Hire a freelance developer for short-term tasks so his team can focus on a bigger, more important task.
Feel confident in the quality and reliability of freelance work.
Ensure that the Cottage platform is secure and protects company assets.
“Alex needs a way to quickly and securely work with freelance talent on short term tasks so that he can focus more on long term product roadmap and larger projects”.
Onboarding User Flow (client side)
This user flow helped us prioritize key screens for the onboarding experience and visualize how clients progress through each step. It ensured a smooth, convenient, and error-aware setup process.
Low-Fidelity Wireframes: Homepage & Onboarding
Home and Pricing
We followed the general structure of an updated homepage and pricing layout the Cottage team was already exploring. Our goal at this stage was to align with the startup’s brand direction while refining the flow and copy to better guide users based on their goals, whether they were looking to hire developers or join as freelancers.
Main Onboarding
For the client onboarding experience, we focused on making the process feel quick, simple, and supportive ,especially for users with basic technical backgrounds. This flow included:
Logging in via GitHub
Importing a repository
Setting environment variables
Adding invitation commands
We designed short on-screen tips and error messages to help users complete onboarding smoothly ,even if something didn’t work the first time. At the end of the flow, we included a confirmation screen letting users know they were all set and ready to start using the platform.
Progressive Onboarding & Dashboard
Because the platform included more complex setup steps, we implemented progressive onboarding using overlays that users could return to later. This ensured guidance without disrupting task flow.
We also designed a minimal client dashboard that made it easy to create and track short-term development tasks across stages.
Client Dashboard
We wanted to keep the Client Dashboard simple and easy to use, allowing the client to quickly add task and see its progress.
User Testing
We tested our prototype with 5 participants and gathered valuable feedback:
3 out of 5 users were confused about the pricing plans and asked for more detailed explanations.
2 out of 5 wanted the error messages to be more specific about what had gone wrong.
All 5 users successfully completed the onboarding flow without dropping off.
All users said the process felt clear and easy to follow.
Design Changes Based on Feedback
Content Iteration: Pricing Page
Based on user feedback, we updated the pricing page to include more specific plan details and clearer distinctions between tiers.
-
Original Text
-
Revised Text
Content Iteration: GitHub Steps
We added a step-by-step instructional message to guide users through the GitHub flow and gave those without a GitHub account an alternative path to explore the platform.
-
Original Lo-Fi Design
-
Revised Hi-Fi Design
Hi Fidelity Prototype
Next Steps
Continue refining the onboarding experience based on ongoing user feedback.
Design and implement a dark mode toggle.
Improve error messaging and add support options like live chat.
Build out the "Invite Team Members" flow (from invite to setup).
This project challenged me to translate complex onboarding requirements into a clear, user-friendly experience. By simplifying the flow and designing inline support for edge cases, we helped reduce friction for new users and improved the platform’s clarity. While final metrics weren’t available at the time of handoff, user testing confirmed that participants were able to complete onboarding successfully and with fewer questions.
This project reflects my ability to lead design work within a fast-moving startup, collaborate with developers, and deliver thoughtful, scalable solutions grounded in user research.