top of page
R
e
e
m
Product Design & Branding
The Challange...
The Biodesign Sprint offers anyone with the spark of an idea the opportunity to explore sustainable solutions for technology-based hardware using biology and biotechnology. With a month to develop projects, Sprint participants gained experience in lightning-fast ideation and product development. Meanwhile, companies—like Google—can identify and collaborate on novel ideas in bio-design.
Our proposal...
We propose that Google lead the industry to fight toxic PAH byproducts by including bacterial strains in their hardware products. The material to encapsulate these microorganisms stands at an early developing stage with several factors to consider in order for the bacteria to survive long periods of time in harsh environments. However, we saw the potential for these microbes to make a significant change and help through the bioremediation process for E-waste. Hence, we decided to introduce “Reem” a 100% biodegradable and nontoxic chip with a QR code that serves as a manual that directs you to the appropriate microbial formula to provide guidance for the disposal of each device using these microbes. Reem is not only a chip. It is an opportunity for Google, the consumer, and waste disposal facilities to keep track of the bioremediation process of each hardware device and experience a new interactive way to get rid of E-waste in a more sustainable way.
My role ...
As part of the research and product development team, I conducted extensive research on google's sustainable practices related to labor, supply chain, and production. I worked on identifying one specific issue that could be resolved within the next 5 years in order for google to continue its path towards a more sustainable future.
Tools ...
Figma, Photoshop, Illustrator, Mozilla hubs, After Effects
CLICK PAGES
TO SEE MORE
Iterations & Reflection
Ui is currently under testing. I created a few samples of combinations of how the site will look. So far the most positive reactions have been towards pink/purple and green combo. Currently working on high fidelity prototype along with backend and AI developers.
What I learned
I'm proud of what I achieved so far. This would be the third design made for this site. Throughout those 3 design changes, I had a variety of people that worked with me. With this, I've come to realize that having a high-quality team that you are able to work with at an accelerated pace and with each individual being able to understand the way each person works, you can get a lot more done than what you could have originally planned. This is not the easiest to obtain. I'd say a great team makes up about 90% of the project. The other 10% is the actual work.
Serving as the creative lead on this project, I learned that being focused and creating a sense of community within the team can generate great results. Making it easier to manage those relationships and turn vision into action.
The site so far has had great interest and reviews. The modest fashion community is very excited and open to this project which feels quite welcoming. I've learned the importance of testing and creating focus groups. Specifically for this project, no one in our team has a modest style. None of us is a direct customer of this product. Therefore, it is crucial to conduct research and obtain feedback constantly from the direct consumer.
There's still some work to be done. I'm excited to continue on this project and see the final result come to life. I feel such a privilege to be working with such talented people and my only hope, for now, is to continue my career working alongside people who continue to teach me new skills but most importantly people who continue to inspire me.
Final Design
UI & Branding
Previous Design
The previous UI design Zymio had was in a much darker tone. The color palette was selected based on color psychology. Since the product aims at people with an interest in modest fashion we decided to make black the primary color black to show elegance and discipline. We choose to add tones of yellow to show excitement, positivity, and happiness. Along with a monkey animation to represent the brand name as "Zymio" which sounds like a "monkey" in Spanish. We wanted the monkey to add a playful and friendly feel to the brand identity.
As a search engine, its function is to find modest fashion quickly, effectively, and with no confusion. Both the mobile and desktop wireframes were designed with a minimalistic aesthetic in mind. It included the search option, a modest styler, and a virtual closet.
Logo & Animation
The most important letters in the logo are the first and last. I designed several versions with the thought of eventually adding the monkey animation to it. I wanted to keep it simple and timeless to be able to incorporate it in the future into an updated design.
In Spanish "Simio" is pronounced the same as "Zymio". It means monkey and it symbolizes intelligence, grace, community, and charm. All terms that represent the brand identity. Since I wanted this character to stick out, I decided to design it with bright yellow color and an affable face. The monkey would be playful and friendly. Its personality would show with the interactions it had with the logo. After the focus group, the monkey was taken out of the brand identity. As it was considered to make the search engine look too busy.
Color Palettes
The previous color palette needed to be analyzed and changed. For this reason, I created three color blind safe palettes that could potentially be the theme for the new brand identity. Without having the monkey in mind, I now tried to look more into color psychology. Once I identified three solid colors that could work based on my research, I added complementary colors. Created 3 mood boards that I tested with a focus group of women of a variety of ages and backgrounds who are interested in modest fashion.
Pink symbolizes youth, friendliness, and kindness. According to data gathered by Adobe XD Ideas most people that identify as a woman do not consider pink as one of their favorite colors. For this reason, I decided to use a strong amount of violet in this mood board to complement it. Violet is more associated with luxury, spiritualism, and quality. It is also a color that is very popular among people of all genders.
Green symbolizes balance, growth, and success. According to data gathered by Adobe XD Ideas it's a color that is equally liked among people. It is a color that makes you feel calm. A color that's also associated with modesty.
Orange symbolizes playfulness, creativity, and Independence. According to data gathered by Adobe XD Ideas is not among the most popular colors but it's a great color for ecommerce as it can be easily identified and seen. I had to be careful with this color and the tone of it as it's a color used by a very known ecommerce site called "Amazon".
Focus Group
Summary
Interviews were divided into 4 categories that touch on Ui design, usability, accuracy, and innovation. Most of the users that participated in the survey were women between the age of 22-35 and located in London, Israel, and New York. Some had a clear idea of the product/service Zymio offers, others had some idea, and a few had no idea what it was about until they tried to use it. All these women share the same interest in modest clothing but are interpreted differently. From 2 peer groups dominated by the Indian (blind) group.
Motivators
The trending arrow is handy and looks appealing.
Modest Styler is the best/favorite feature so far.
The available brand section is handy.
Diversity is well shown on the website.
The name is unique and makes users curious to learn what it is.
Sharing the closet with other friends/social media is appreciated.
Zymio’s USP - the focus on modest fashion, the styler, the fact that an image-related search exists, trending, for the informed American group even sharing on socials is a big win, other than clothes even the models seem to be more inclusive ‘real like’.
Pains
How can modesty be better cued through the entire website? Use colors, and imagery that depicts this better. Poor display of information for each item description.
Modest styler: could use examples of favorite styles made or similar styles that the user is looking for.
Brands available: needs a drop-down section to show available brands by name. Should also have filtering available.
Search bar: display is not great. Icons should be rethought and adding a direct button to modest styler should be considered. No need for “for” or “AND”. Should just be “Search Items or Brands”.
No reviews are displayed on the site for each item.
The price range is not affectively displayed once filtered and it only allows it to go to $200.
Consistency through how data is presented, images, models quality of the products, and their description need to be streamlined and made consistent. Without this, the website looks WIP/ less than/ peer to peer like eBay.
The ‘buy now’ confuses the audience as to what the website does as they can’t directly buy.
For new/ unknown brands they want more information and exploration - an introduction to that new world.
What search throws up needs to be based solely on their search and not general - some non-modest options appear and also some general unrelated options too.
A competition sets mentioned have largely been fashion apps (as the benchmark) - Zara, Mango, H&M- Model vs garment feature, like American eagle have that whole 360-degree view thing or videos of people wearing it and moving about, Rifle paper co Everlane People Tree H&M, ASOS, Vestiare Co. in the UK - need to take inspiration, especially in the way in which data is presented / fashion inspiration.
Largely consumers want curated content for self (despite loving the trending) it needs to trend based on my choice/ preferences - new dimensions to look at clothes trends - not just stick with 90s fashion or current pop fashion, have specifics like - puffed sleeves, embellished collar or like Powerful look, Cutesy/Romantic, Athletic, Bohemian, Fantasy
Fabric and sizing/ coverage become important issues that could be supported through the engine - fabric not realizing how it would feel, how much it would stretch, with sizing it is how it would fall as none have the typical body type - or may have fluctuating body sizes - some issues even with standardized sizing not being consistent even with the same brand, the same pattern, the length fluctuates.
Personas
Based on my secondary research and focus group, I created 3 main user personas to reference through my design process. Each represents a different age group and background, however, they all live in the US.
Amna is in her mid-twenties and practices Islam. She lives in Houston with her new husband and is currently focused on growing her career and attending multiple family events. Rachel is in her mid-thirties and is investing more in her wardrobe for the new events she's starting to attend as a marketing director. Indra is an accomplished senior businesswoman who needs to always look her best but doesn't have much time to pick an outfit.
They all want to dress modestly for any event and they are looking for variety in style, season, material, and occasion.
Architecture & Wireframe
Sitemap
The sitemap provides an overview of how Zymio works. This shows the site navigation as well as all the screens that should be included on the site. On the left side, I highlighted a column in red of filters that should be added to the site for the user to be able to find the item they're looking for more efficiently.
Mobile Wireframe
Desktop Wireframe
Once the mobile wireframe was completed, I then proceed to develop the desktop wireframe. Translating the mobile wireframe smoothly into the desktop. Everything remains with a minimal aesthetic in order for the user to not get confused. There are a couple of changes from the mobile to the desktop wireframe. For example, the modest styler changes slightly in layout due to the space of the screen. On the desktop wireframe, there is no option to change the grid view as your scroll since the user is able to see all items fully on the screen.
.png)
UI Kit
I created a UI Kit as I began to design. This allowed me to stay organized and be able to alter my designs accordingly. I went through my wireframes and made a list of components I needed to make to be used in the future. The Kit is available for anyone in the team to use and change color, size, text, and icons as they need to.
The Start
Research
For Who?
Google Hardware
Design Prompts:
E-waste and Recycling
What if the devices decayed gracefully into the environment? What if they acted more like organisms that could be composed? or perhaps heal themselves when damaged? Imagine a future without e-waste and its environmental impacts. This can include concepts around recycling technologies and processes, e-watse disposal, and other end-of-life solutions. Today, e-waste accounts for more than two thirds of heavy metals in landfills and only nine percent of plastic in the US are recyled.
Materials
What if product materials were grown instead of manufactured, what if they were derived from waste, repairable, repurposable, responsive, and truly sustainable? What if they could provide benefits to the user or their surroundings? What new materials could be utilized for consumer electronics of the future from phones and speakers to laptops and more? Invent and apply the materials of the future.
Research Goals:
-
Find out more about the hardware manufacturing industry and it's most sustainable practices.
-
Determine which pillar of sustainability we would focus on.
-
Look into what kind of solution would Google be interested in and if it would be doable within the next 5 years.
Sustainability Analysis:
I conducted interviews and online research to understand what are some of the sustainable and unsustainable aspects of producing hardware. I looked into what information Google provided in relation to their products, supply chain, people, and environmental impact awareness.
Interesting Reads
What is Google doing?
Product
Supply Chain
People
Materials
-
Internal recycled aluminum body.
-
The outside shell is made from 30-70% recycled plastic.
-
70% of post-consumer recycled plastic including textiles made from recycled water bottles
Design
-
End-to-end mineral tracking
-
Advancing renewable energy
-
Allowing consumers to take part in the supply chain by providing recycling, trade-in product, or refurbishing options
-
Community investment.
-
Work with suppliers and upstream communities to minimize the negative impacts on workers
-
Creating codes of conduct in favor of the workers
-
Investing in programs that create economic alternatives to mining for local citizens.
-
Simpler design with less parts
-
Versatil
Packaging
-
Alternatives to plastic and aiming towards plastic free packaging
Found Issues
bottom of page