Overview
The Social Snippet, a marketing agency, was looking to create their website, including the home, service, and blog pages. They didn’t want to make significant changes to the branding they had already established. However, to enhance their branding impact and visual aesthetics, we decided to create new UI components for the website design.
My Role: Freelance Web/UI designer
Team: PM (1), Senior designer(1), Web/UI designer (1, Myself), WP developer (1)
01 Define
Proposal Document
UI Kit design
For the website and UI component design, there was no need to create everything from scratch because the company already had an established branding theme. I added some complementary colors that align with the existing color theme and selected a font that matches the vibe the company needs. I used Figma for the webpage design and received feedback from a senior designer through Figma comments. The entire process was effectively managed through Asana as a team collaboration tool.
02 Responsive Web design
Responsive web design process
For the webpage design, the client requested to skip the wireframe phase due to time constraints, which I found to be a good decision for this simple project. There was no need to use functional features on this website, and I believe it was a very appropriate choice.
03 Reflection
What I Learned
I usually create branding colors based on the Web Content Accessibility Guidelines (WCAG) and check the color contrast ratio first. However, for this project, I focused more on visual aesthetics for the font and color theme because our client prioritized their target audience, who are typically young and trendy in the startup business. This gave me the opportunity to use complementary colors and trendy fonts. Additionally, I skipped the wireframe phase at the client’s request, which I found to be very time-efficient for a simple design project.