Collaborative Design Practice - Task 3: Testing & Refinement

23 Oct 2024 - 20 Nov 2023 (Week 5 - Week 9)

Vincent Lee // 0359386 

Collaborative Design Practice // Bachelor of Design (Hons) in Creative Media // Taylor's University

Task 3: Testing & Refinement

---

Instructions

<iframe src="https://drive.google.com/file/d/1XvuCSHWO8oGSgIVRrANRM6apD2GmbB-S/preview" width="640" height="480" allow="autoplay"></iframe>

Notes:

• Week nine prototype presentation and share to get feedback 
• Week ten final tutorial what we want to refine the finalised outcome 
• Present the final outcome on week eleven 
• Packaging design need to discuss and refine after

Task 3: Testing & Refinement

Your group will create low-cost, scaled-down prototypes of the product or its specific features to explore and test solutions identified in earlier tasks. This experimental phase aims to find the best solutions for each problem by implementing them in the prototypes, then evaluating them based on user feedback. 

Solutions will be accepted, refined, or discarded based on user experiences, helping your group understand the product’s limitations and how users might interact with it. Documenting the prototyping process is recommended for iterative design development.

Week 5 - 16 Oct 2024

After the presentation, we will proceed with the following steps:

• Brand Identity and Packaging (Agnes Fadhyllah, Benjamin Ng Chii Wen, Rachel Madeline Purwanto and Sim Jian Xiong)

This week, the graphics team has narrowed down the style to focus on Scandinavian patterns with fewer details. They also explored different design approaches for each scent, as shown in Figures 1.1 to 1.3. The designs include a Scandinavian pattern with a packed layout (top left), a more minimal version with fewer patterns (top right), and one that leans towards a more illustrative approach (bottom left).

Figure 1.1 - Baby Powder Scent

Figure 1.2 - Apple Scent

 

Figure 1.3 - Rose Scent

For the interior design, we chose a cleaner approach compared to the exterior. The focus was placed on highlighting the product's scent and key information to create a simple yet effective layout.

Figure 1.4 - Interior Design Expansion

Figure - Additional Sketches

• Social Media Content Planning and Animations (Joan Chiam Zi Woei)

Next, we worked on social media scheduling and content planning, which includes static posts, educational content, product mockups, animations, and 3D animations.

 

Figure 1.5 - Social Media Content Planning, Week 5 (23 Oct 2024)

• Wireframe and Prototype (Vincent Lee)

This week, based on client feedback, I conducted further visual research to identify key elements across different website styles. The goal was to address the current issues and improve the overall layout and color distribution.

 

Figure 1.6 - Clients' Feedback

Figure 1.7 - Visual Analysis: Illustrative & Playful and Article-Centric Style

Week 6 - 30 Oct 2024
Continue with our own tasks, below are the progressions and development of each section.

• Mascot Digitization (Sim Jian Xiong)

Explored different fonts after realizing that the current ones did not align well with the mascot's design.

Figure 1.8 - Fonts Attempts 

While refining the mascot's silhouette, focused on balancing positive and negative space and explored its colored application to ensure a cohesive design.

 

Figure 1.9 - Colour Attempt

• Packaging Digitization and Mockup (Rachel Madeline Purwanto and Joan Chiam Zi Woei)

Figure 1.10 - Rose Scented Packaging

Figure 1.11 - Apple Scented Packaging

Joan discovered an open-source mockup for the packaging, which provided us and other stakeholders with a clearer visualization of how the final product might look before production.

 

Figure 1.12 - Mockup

• Wireframe and Prototype (Vincent Lee)

I continued searching for images that align with the website's aesthetic, aiming to balance a Scandinavian style with an article-inspired layout.

 

Figure 1.13 - Assets

Figure 1.14 - Revised Home Page Layout (2nd Exploration)

Week 7 - 06 Nov 2024

With the submission deadline just a week away, issues persisted as the designs across divisions lacked consistency and remained in a state of exploration. This hindered other team members from progressing with their tasks. To address this, we were advised to develop brand guidelines as part of the Task 3 submission. Below is an overview of the progress made, highlighting key stages to provide a general understanding of the process and iterations.

• Brand Guideline and Finalised Packaging Digitisation (Agnes Fadhyllah, Benjamin Ng Chii Wen and Rachel Madeline Purwanto)

The graphics team prepared the slides as part of their responsibilities.

 

Figure 1.15 - References

Since none of us specialize in graphics, we relied on references to identify the necessary content to include. Our goal was to help our clients create a well-thought-out brand that would effectively establish their brand identity.

 

Figure 1.16 - Brand Guideline's Table of Content

We also finalized the packaging design with several adjustments, ensuring that the design styles were consistent across each scent and that the same graphical elements were used. This approach allows for easy product extensions without the need to create new packaging for each product. Additionally, by maintaining consistency, it strengthens the brand identity and makes it easily recognizable to the target audience and potential users.

 

Figure 1.17 - Finalised Packaging Design

Scandinavian patterns offer a wide range of options, but we narrowed it down to a few, such as stars and leaves, as the supporting graphical elements for our brand. For the main design elements, we focused on the scent of the product and created several variations for each scent, which are then used consistently across the packaging. This approach allows for flexibility, avoiding reliance on just one design option, while also supporting future product development by ensuring new products maintain a cohesive look.

Figure 1.18 - Graphical Elements

• Mascot in 3D (Joan Chiam Zi Woei)

As proposed from the initial stage, the mascot design has now been confirmed. We have brought it into Blender for 3D rendering, which will then be used for animations as well as for content on social media and the website splash screen.

 

Figure 1.19 - Mascot Rendering in Blender

Week 8 - 13 Nov 2024

To keep everyone on track and ensure each member understands what others are working on, we created a detailed list to break down all the tasks for our current stage. This helped address the inconsistency issues and prevented any member from feeling left out or confused. Primarily, the list served as a self-navigation tool for us, ensuring we didn't burden others with additional tasks and that everyone remained aligned and on track.

 

Figure 1.20 - To-dos lists, Week 8 (13 Nov 2024)

In the same week, here are the updates from our team: most of the graphics-related tasks were completed and are ready to be included in the slides for the next presentation. As for me, I am still in the process of translating the brand's playfulness into visuals.

 

Figure 1.21 - Update of Overall Progressions, Week 8 (17 Nov 2024)

• Brand Guidelines (Agnes Fadhyllah, Benjamin Ng Chii Wen and Rachel Madeline Purwanto) 

For more details on the development of the logo, mascot, typography selection, and packaging design, please refer to the slides below.

 

Figure 1.22 - Completion of Brand Guidelines

Figure 1.23 - Iteration Packaging Design: Apple Scent

Figure 1.24 -  Iteration Packaging Design: Rose Scent

• Social Media Content (Joan Chiam Zi Woei and Sim Jian Xiong)

Visualizing the wording through imagery and using text in bullet points is a good approach. However, it is essential to improve the overall consistency with the brand identity to ensure the messages are clearly aligned with the brand’s tone and values.

 

Figure 1.25 - Social Media Feeds

• Product Mockup and Animations (Joan Chiam Zi Woei)

Both the mockup and animation are part of the content for social media. They will also be integrated into the website as a product showcase, featured in a product carousel.

 

Figure 1.26 - Product Mockup and Animation

• Wireframe and Prototype (Vincent Lee)

In accordance with the Week 7 feedback, the design was revised by removing the blackened lines and introducing a completely new look. More colors were added, and the typography was adjusted to reflect a softer, more curvy style, improving readability. The layout was redesigned with a free-flowing approach, without strict column structures. The design still incorporates real-life images, along with abstract patterns.

Left: Home Page; Right: Product Page

Figure 1.27 - Layouts and Colour Coordination Attempt

However, I noticed that the inclusion of shapes was too cluttered and distracting, not aligning well with the brand identity and its graphical elements. On the other hand, I really liked the product showcase on the product page, where the actual product is overlaid on its respective pattern based on the scent. The placement is also well thought out, as it only shows the top part of the packaging, deliberately avoiding the bottom. This design choice was created to mimic the experience of users pulling tissues from their pocket.

 

Figure 1.28 - Overall Outcome of 3rd Exploration

After several attempts and considering the issues mentioned above, my main focus will be on the cloud design, with smaller elements like flowers and shapes used in reduced quantities and sizes. Additionally, I noticed that the information design on the About Us page could be improved, but I will leave it as is for now and wait for feedback from the clients and Ms. Li Lian before making any changes.

 

Figure 1.29 - Website Finalised Design

Figure 1.30 - High-Fidelity Wireframe, Week 8 (18 Nov 2024)

Task 3 Submission

Compiling the iterations of the design development and showcasing the final design as the company's brand guidelines.

Figure 1.31 - Task 3: Brand Guidelines, Week 9 (20 Nov 2024)

Figure 1.32 - Fold Social Media Content Planning

Brand Guidelines/ Presentation Slides: Link

---

Feedback 

Week 6

• The overuse of shapes and pictures, such as squares, to fill up the layout has disrupted the overall fluidity, while the lack of brand elements has contributed to this inconsistency.

• For the packaging design, it was suggested to reduce the number of patterns and elements to achieve a cleaner look, in line with the initially proposed Scandinavian theme.

Week 7

• The overuse of lines as elements should be reconsidered; integrating them with patterns could bring out the fun side of the brand.

• The font used for the text logo and website needs to be reevaluated, as the logo and headings (especially in the hero section) are competing and overpowering one another.

• It's important to establish the brand identity first. The fonts used for the logo don't necessarily need to be applied to the headings and titles on the website.

• There seems to be a lack of communication and some behind-the-scenes delays in the progress.

• The mascot digitization isn’t fully refined yet, as the edges on the corners appear too sharp.

• The placement of the brand name next to the mascot makes it seem overthought. It’s suggested to experiment with different arrangements of the mascot and brand name to see what works best.

Week 8

Independent Learning Week.

Week 9 - Presentation Task 3 Feedback

• Packaging

The packaging development is well underway, but it could benefit from simplifying the design. Introducing a cohesive colour palette along with graphic elements would enhance the overall look.

• Typography

The product information is currently missing, and the typefaces used are inconsistent. It's important to cohesively decide on fonts to use throughout the entire project to achieve consistency.

• Website:

The impact page feels disconnected due to the shapes and color choices. Instead of using shapes extracted from open sources, we should take elements from the logo and integrate them into the design to maintain a consistent and branded look.

---

Reflection 

Week 5

I conducted further visual analysis relevant to our design concept in hopes of capturing its essence. This was aimed at resolving the issues I encountered with the stiffness and rigidity of the overall layout. I also realized that restricting ourselves to black and white limited the brand identity and recognition, which could be problematic if we were to launch the website in the future. 

Week 6

This week, we focused on finalizing the packaging design based on client feedback and Ms. Li Lian's input. Since time was running short, we needed to quickly select one design to refine with color adjustments and any other potential placement issues.

For my website, I ended up creating an entirely new layout for the Home Page, but the process was draining. Despite putting in a lot of effort, I still didn’t meet my own standards. It felt as if my design was influenced by others’ inspirations, rather than something uniquely mine. I started questioning whether it’s normal to feel this way and wondered when I would be able to create something on my own that could inspire others, without relying on others' ideas. I want to be better in this industry, but at times, I doubt whether I have the skills to get there. It’s frustrating, but I remind myself that maybe I just need more exposure and time to study. My goal is not to compete with others but to grow and improve.

Week 7

I realized that the packaging design shouldn’t have been assigned to Joan due to group conflicts and communication issues.

The tasks were split as follows:

1. Rachel worked on the brand identity slides.
2. Joan and Sim focused on social media and animations.
3. Ben, Agnes, and Rachel worked on finalizing the digitization of the product packaging design.

Week 8

This week was incredibly exhausting. I struggled with selecting the right font, color palette, layout, composition, content, and copywriting. It felt like too much to handle on my own, and I doubted my decisions. The outcome didn’t meet my expectations, and it was disheartening.

So, I revamped everything again and conducted more visual research to better understand the core design elements that make a website or brand feel fun, playful, and vibrant, including tone and copywriting.

Despite completing all five pages of the website, I felt that the color coordination and layout still needed improvement. I decided to leave it as is and seek help from my teammates.

Week 9

I made it, we made it. Despite my earlier intentions not to leave things until the last minute, I pushed through. For the feedback given, I did a better job of elaborating on my design process and problem-solving, but the outcome still wasn’t as impressive as I had hoped. I could feel that my classmates shared the same sentiment. Ms. Li Lian's feedback was valuable, but I wished she had provided more specific suggestions to help me understand where I was lacking.

In the past few weeks, while our group had more open discussions, the outcome didn’t reflect this progress. The lack of consistency across our work was evident. I also noticed myself becoming more negative and feeling hopeless about this module and my grades, no matter how hard I tried. My time was taken up by other modules, which meant I couldn’t contribute to others’ tasks as much as I’d wanted. But with only two weeks left, I can only hope for better solutions to improve the quality of our work.

---

Quick Links

Task 1: Insight to Action

Task 2: Brainstorming Solutions

Task 4: Testing & Iteration

Final Compilation & Reflection