Ammil Skin care

An adventure I embarked upon during my exchange program in Finland. With a keen focus on sustainability and a commitment to crafting a unique and personalized experience, this project delved into the realm of skin care branding, aiming to create an impactful and resonant brand identity.
explore my work
image result of homepage design skin care
words describing the projecgt
go back up the page

The assesment

Our project revolved around crafting a fictional international skin care brand, starting from scratch. Our focus was on young adults up to 30 years old. Amidst the plethora of information on the internet, our goal was to establish a brand that simplifies access to the right skin care products, adding a personal touch.

The challenge we embraced was deciphering what this target group truly seeks, pinpointing our areas of concentration, and ensuring our brand offers accurate and relevant information. In the pursuit of creating a brand that resonates, we navigated through these intricacies, striving to create a seamless experience for our audience on their quest for optimal skin care solutions.

my goal: to create an innovative and user-centric skincare brand while simultaneously developing my personal skills in web design and web development

Index

“A design student who always goes the extra mile. Interested, enthusiastic, curious, not afraid of the unknown and very eager to learn. Clear goal in mind, I’m sure she will achieve that goal.“

Stephanie van der meer - Study career counselor

Research

Our research journey encompassed several key areas. We delved into sustainability and simplicity, focusing on ingredients, packaging, and nature. By analyzing these aspects, we honed our commitment to eco-friendly practices and embraced the allure of the natural world.

In the realm of competition, we gleaned valuable lessons. Our analysis of competitors informed our quest for uniqueness. By understanding the market landscape, we charted a path that would set us apart and resonate with our audience. Our investigation also extended to our target audience.

Through careful research, we uncovered their behaviors, challenges, and aspirations. Armed with this knowledge, we devised strategies to reach and engage them effectively.

In conclusion, our research provided invaluable guidance, shaping our approach to sustainability, competition, and audience engagement. These insights lay the foundation for a distinctive and impactful brand journey.

Vizualizing research

To make sense of our research, we transformed our findings into two powerful visual tools: a mindmap and a moodboard.

The mind map is like a map that guides us through the insights we've gathered. It shows how different ideas connect and helps us see the bigger picture. This visual aid is an invaluable resource, helping us make informed decisions and stay on track.

The moodboard, on the other hand, is a collage of images, colors, and textures that capture the essence of what we've discovered. It's like a visual representation of our research's mood and vibe. This creative compilation serves as a constant source of inspiration, remindingus of the direction we're headed.

Together, these visual aids bring our research to life, helping us stay focused, inspired, and aligned as we move forward in our project.
moodboard skincare
Moodboard
mind map image
Mindmap

Brandguide

Developing a brand guide is a crucial step in creating a strong and consistent brand identity. It's like a rulebook that ensures everyone knows how to represent the brand accurately. From colors and fonts to logos and messaging, a brand guide keeps everything cohesive and recognizable.

In this journey, I took the reins and led the process of creating our brand guide. I carefully defined the visual elements and voice that our brand embodies. This guide will be our compass, ensuring that no matter where our brand appears, it speaks with one clear, unified voice.

By having a brand guide, we're setting the foundation for a strong and memorable brand presence. It's an essential tool that will help us make a lasting impact and connect effectively with our audience.
brandguide skincare

Brainstorm

We united for an energetic brainstorm, driven by thorough research, to craft a winning marketing strategy and compelling website. Research led us to focus on social media for seamless audience connection, and real-world locations like public transport for brand reinforcement.

Our website innovation sparked: a personalized product test tailoring unique solutions, sustainable packaging design, and an eco-friendly refill concept. This brainstorm set our path – blending insights and creativity – ready to deploy a resonant marketing strategy and engaging, personalized website for our target audience.

Flow-chart

Flowcharts are pivotal in our website creation process, bringing clarity and structure to crucial steps. In our context, they hold essential roles: guiding the skin care testing process and personalized packaging creation.

For skin care testing, a flowchart outlines user steps for tailored recommendations, ensuring a seamless experience with clear decision points and pathways. This precision enhances efficiency and user satisfaction.

Similarly, in crafting personalized packaging, a flowchart navigates users through sustainable choices. This visual guide minimizes confusion, enhancing engagement.

In essence, flowcharts are our navigation tools, shaping user-friendly, streamlined website development aligned with our brand's goals.
flow chart test
Flow-chart test
flow chart packaging
flow-chart packaging process

Sketch

I kicked off my journey by sketching out the essential webpages. This initial step gave me a glimpse of how content and functions could be organized. By mapping out these fundamental layouts, I gained valuable insights into where everything should go. This groundwork not only provided a clear path forward but also set the stage for a well-structured and user-friendly website.
wireframe hand sketch

Wireframes

Building upon my initial sketches, I transitioned to creating wireframes. These simplified blueprints allowed me to translate my ideas into a more structured visual representation. With wireframes, I could outline the layout, placement of elements, and overall flow of each webpage. This step was essential to ensure a coherent and user-centered design. Wireframes acted as the foundation, guiding me in refining the user experience, optimizing content placement, and ensuring a seamless navigation throughout the website.
wireframes

Visual design

Taking the wireframes as my guide, I embarked on bringing the website to life through it's first visual design. This step involved adding colors, typography, images, and other visual elements to the skeletal structure.

The initial visual design serves as a sneak peek into the website's aesthetic and atmosphere. It's an exciting phase where the concepts start taking form, giving us a tangible glimpse of the final product. This design iteration allows us to assess the overall look and feel, ensuring it resonates with our brand identity and user expectations.

While this is just the starting point, it's asignificant stride towards a cohesive and engaging website. With the first visual design in place, we're closer to creating an immersive online experience that captures the essence of our brand and resonates with our target audience.
first visual design homepage
second design homepage

Feedback

In the spirit of crafting an impactful website, I took a moment to gather valuable feedback. This step allowed me to refine and iterate on my design for optimal results.

One insightful suggestion I received, was to reorder the presentation of content. Instead of immediately showcasing common products, it was advised to begin by illustrating the process of creating a personalized skin care product. This adjustment aligns perfectly with our goal of engaging the target audience in crafting their own unique solutions.

By taking this step back and incorporating feedback, I'm enhancing the user experience and ensuring that our website effectively captures our audience's interest and involvement. This iterative approach ensures that our design resonates powerfully with our brand's mission and user preferences.

Full design

Receiving feedback, I embraced iterative design, refining and harmonizing for coherence and brand alignment. This journey creates a captivating visual symphony, resonating powerfully with our audience and embodying our unique brand. From sketches to wireframes, feedback refines. Visual design adds life, each element embodying our brand and engaging our audience. The culmination is the full visual design – a harmonious composition, reflecting our brand's identity through iterative mastery.
homepageexplanation page about the test
test screen test pagequestion three page
result of the test page
wishlist pageprdouct pageproduct detail page screen
packaging screencreate a package request screencreate pachaging screen
result packaging pagelocation stores page
login screencreate account screencreate account screen
about us page
payment screenpay system pagepayment succesfull screen
contact pagetextual page sutainabilitytextual page sutainability

Webflow development

With the design finalized, I embarked on the exciting journey of turning it into a real, functioning website. Armed with Webflow and a determination to learn, I navigated the challenges that came my way.

Animations breathed vitality into the website, adding a touch of magic to each scroll and click. Sliders transformed static content into dynamic showcases, capturing attention and guiding visitors effortlessly.

One remarkable highlight was creating a fully functional skin care test – a testament to our commitment to personalized user experiences. Despite being my first time using Webflow, the process was surprisingly enjoyable. It was a thrilling mix of learning, creativity, and problem-solving.

As I put the finishing touches on the website, I can proudly say that my perseverance paid off. From concept to a tangible, interactive reality, I've achieved something remarkable. The challenges I faced only served to enhance the sense of accomplishment. Our website now stands as a testament to dedication, creativity, and the boundless potential of technology.

Testing

As I finalized the website, testing revealed a new challenge: responsiveness. Elements behaved differently on various devices, and testing expanded beyond Webflow to different browsers. This process highlighted the need for adaptability and thorough testing, reinforcing the importance of a seamless user experience. With determination, I'll optimize and fine-tune the website for a cohesive digital journey across all platforms.

Conclusion

In this remarkable journey, our skills flourished and our horizons expanded, as we embraced the challenges and triumphs that define a true growth experience. This project, a testament to international collaboration, has not only shaped our abilities but also left an indelible mark on our shared pursuit of knowledge and achievement.

Reflection

Reflecting on this journey, I'm proud of my growth in web design and Webflow development, yet I acknowledge the missed opportunity to engage users more intimately through interviews and surveys to enhance our design's user experience. Time constraints focused my efforts on technical aspects, limiting my ability to thoroughly test the design. This experience underscores the importance of striking a balance between skill development and user-centered design, guiding my commitment to create more meaningful and inclusive digital experiences in the future.
See the next project!
image result redesign recruitment website
SOLO - UX DESIGN - UI DESIGN -RESPONSIVE - PROTOTYPING
A redesign of a recruitment agency
Read more