Strand BioTech

Angela Ma

Illustrator
UI Designer
Framer Designer
Figma
Framer
I was approached by a biotech company to design and develop their website from the ground up. The company’s primary user base consisted of women, and they wanted a design that reflected this demographic—feminine, approachable, and user-friendly. My role involved everything from the initial concept to the final launch, including UI design, creating a comprehensive style guide, and building the site using Framer.
Objectives
• Create a Feminine Aesthetic: The website needed to resonate with the company's predominantly female audience. This required careful consideration of color palettes, typography, and overall visual style.
• User-Friendly Interface: The UI had to be intuitive and welcoming, ensuring that users could easily navigate and access information.
• Brand Identity: I was tasked with designing the logo, icons, and other branding elements to establish a cohesive and recognizable brand identity.
• Full Development and Launch: I built the website from scratch using Framer, ensuring a fully functional and responsive site.
Process
1. Research and Inspiration
I started by researching the target audience, focusing on design elements that appeal to a female demographic. I also looked at competitors to understand industry standards and identify opportunities to stand out.
2. Visual Design
• Color Palette: I chose soft, warm colors that convey a sense of calm and trust. The primary colors were shades of pink and lavender, complemented by neutral tones.
• Typography: I selected friendly, rounded fonts that are easy to read and add a touch of approachability to the design. The typography was crucial in setting the tone for the website, balancing professionalism with warmth.
• Icons and Logo: I designed custom icons and a logo that aligned with the feminine and friendly theme. The logo features organic shapes and a soft color gradient to evoke a sense of health and vitality.
3. UI Design
• I focused on creating a clean, intuitive layout with plenty of white space, allowing the content to breathe and ensuring that users could easily find what they were looking for. The navigation was kept simple and consistent across all pages.
4. Style Guide Creation
To ensure consistency across the brand, I developed a detailed style guide that outlined the color schemes, typography, iconography, and usage guidelines. This guide served as the foundation for all future design and marketing materials.
5. Development and Launch
Using Framer, I built the website from scratch, ensuring that it was fully responsive and optimized for all devices. The site was then thoroughly tested for usability and performance before the final launch.
Outcome
The website was successfully launched and received positive feedback from both the client and their users. The feminine design and user-friendly interface effectively catered to the target audience, enhancing the brand’s appeal and credibility. The fully functional site built with Framer demonstrated not only the visual aspect of the project but also my ability to handle the technical side of web development.
Partner With Angela
View Services

More Projects by Angela