Rebrand
September 2022 - March 2023.
Visual Identity/Branding and Website UI/UX Design.
Over the course of six months, I worked to create a visual identity and website for a quinoa beer start-up called ‘Rebrand’. For the first couple of months, I worked with Samara Oster, one of Rebrand’s Co-Founders to create a visual identity for the new brand. After establishing the concept of ‘Rebrand’, I worked for the next 2-3 months to create sketches, mock-ups, prototypes, and high-fidelity iterations of a potential Rebrand website. Finally, I worked in collaboration with Ada Banaszak, our Front-End Developer, to produce the final site. Check out the final website here: https://www.drinkrebrand.com/
Visual Identity/Early Research:
I worked with Rebrand’s graphic design elements/style guide and company Co-Founder to develop personality boards for the brand. I focussed on targeting a young, modern, health-conscious user group through visual tropes and colors. I developed collaborative Figma boards and a slide presentation for reference purposes as we began to develop the visual identity of Rebrand.As we considered colors for the product, Hockey’s painting, ‘A Bigger Splash’ stood out to us - emblematic of a sophisticated, young, fresh summer’s day. This image provided the basis of our color palette.
![Hockney, 'A Bigger Splash'](https://freight.cargo.site/t/original/i/b08d8c54222b14ed1375cccf563cc5cdb22a20462ee5c6d91f31119c10a53e26/A-Bigger-Splash-Version-2-by-Insanegraphix-on-DeviantArt.jpeg)
Other Rebrand style reference images:
![](https://freight.cargo.site/t/original/i/c3515f5eb72c802ab0fd9fe10670ffc82e2755a0810f51cd9b32c77e33ffb091/amy-shamblen-3G8k9IhI6FE-unsplash.jpg)
![](https://freight.cargo.site/t/original/i/edce4be05584d6a6c1006632a36c82ddcd4c6fe188f3b7540a3dac9f5a086cb3/yasin-aribuga-y_qw9oGznUg-unsplash.jpg)
![](https://freight.cargo.site/t/original/i/40f6d4fb7489eda2ce60cff55282131a2368d90f543b4f4c68ee024b7f6917a2/jojo-yuen-sharemyfoodd-IeJ2G9xepUg-unsplash.jpg)
![](https://freight.cargo.site/t/original/i/25c7bec8e8912242bbc409ebb519204a28392c5cda59890260fccf43bc3b5a88/yasin-aribuga-FBUaNlGZbh4-unsplash.jpg)
![](https://freight.cargo.site/t/original/i/15134a06d5f7ce0e0b8765bef6452d5cf6f1c1dd28aea8d4e2a8a5359f513c8e/yasin-aribuga-_tXS0XJfGmk-unsplash.jpg)
![](https://freight.cargo.site/t/original/i/a6845afd34e560adebe6f6ea1cbeaf3b1f39dc8b73e43b28be7fbf640e2604d8/le-petale-studio-cNxObP-3HPE-unsplash.jpg)
![](https://freight.cargo.site/t/original/i/e4642bc95efc26bfa008fee6307c0064945d3b1ed82599ec558bde49e96da0fe/no-revisions-eSLTfkRdW84-unsplash.jpg)
![](https://freight.cargo.site/t/original/i/a3709afa17bc076bdc02669087f27e58a91f9bbcc58d0e688372bed815d7b587/no-revisions-suT4n42tJ9Q-unsplash.jpg)
![](https://freight.cargo.site/t/original/i/01d68de1dfa4c0729f5cf9939b61a4ebc05394a5accfb1b954cd49a2d7b7cb99/yasin-aribuga-daMT4OR3Eac-unsplash.jpg)
![](https://freight.cargo.site/t/original/i/1903d27e942c855adfbd9a368c61c728d186f1cb5c6ee88b865fecaa2b38d0a1/yasin-aribuga-XDOuJECCh7s-unsplash.jpg)
![](https://freight.cargo.site/t/original/i/b7e77ad7b6b20a12c710bd924204841c2f78079f916216bd4ce32e4454b9be61/A-wonderful-blue-retro-bathroom----Retro-Renovation.jpeg)
![](https://freight.cargo.site/t/original/i/e534f0c611868c8f284c5082e91cfc1882503e14a1cf0da5d0688676d8a4d230/Fashion_-Ladies-and-Their-Lizards.jpeg)
![](https://freight.cargo.site/t/original/i/9ce6fa65c334fd601129ef2255111929d64ab60eaa1bcaba0c5a8fa053183ffe/yasin-aribuga-RQJ08t1UkmQ-unsplash.jpg)
![](https://freight.cargo.site/t/original/i/e8b6fd103b2a561988c348147151c5fa630874638f5b66110cd8e4951c29af58/OI09I7838O.png)
![](https://freight.cargo.site/t/original/i/c4e584758b86ee5d05c2abb46d07f7b49ddfe5b80ae423d2a3725c34dc450a1a/Hinds.jpeg)
![](https://freight.cargo.site/t/original/i/47ae0d904d4c67013cbded12a0e7877f6efe49135f5055d2af9482ffb4716b77/Feast-or-Famine.jpeg)
![](https://freight.cargo.site/t/original/i/143bd09ee0098309247cc255c9ee096967241be3c18d6b3fcb61a72c4ce0185c/alexandra-avelar-lefsKCB6Heg-unsplash-1.jpg)
![](https://freight.cargo.site/t/original/i/e47192561e7ba6c766cf43406b3bf5fc942934ce87641426b93ebe6eb2f0938c/yasin-aribuga-57WvjU4wxMI-unsplash---Copy.jpg)
Wireframes:
Using some of the visual elements provided by our graphic designer, I developed some wireframes/basic mock-ups of the website. Hoping to target users on phone, we decided to design for phone with responsive elements for web and tablet. Using the packaging designs, I worked to make some color and style variations of a possible website.![[Packaging Designs 1 & 2]](https://freight.cargo.site/t/original/i/4f7d37d6f8e85c0863f640282c794e42449ab6f7aaadb72731528b10ea43034f/Screenshot-2023-05-16-150907.png)
![[Packaging designs 3 & 4]](https://freight.cargo.site/t/original/i/fd30d5cd102d147390104f21e3ccd6f1911901b150ba05ef1ca014fc007d8a1c/Screenshot-2023-05-16-150916.png)
![](https://freight.cargo.site/t/original/i/9b740d953b586cc456084c34fb1793fe7e3373cc3dd741625f083f77e2e9006c/Screenshot-2023-05-16-143610.png)
![](https://freight.cargo.site/t/original/i/48a01728f81421320e056cce4e154cd918a062272c36e2f790fcbcf215f7c831/Screenshot-2023-05-16-143620.png)
![](https://freight.cargo.site/t/original/i/b2a4901f394c527ea846c14122066be2c923c9d5af86c0a035835c6d8f7ad4d8/Screenshot-2023-05-16-143658.png)
![](https://freight.cargo.site/t/original/i/d290f4aa1f937c8b112ab8a668709ae3408d8904b6e66a26f9f80df8399338d2/Screenshot-2023-05-16-144908.png)
![](https://freight.cargo.site/t/original/i/296a4293a9c53ee387698a27cf17674b7756300e4a64a7cd97e4224004f03056/Screenshot-2023-05-16-143752.png)
After looking through these designs with Samara, we opted for a more minimal style in line with the packages. We also looked more at other brand’s websites for inspiration, specifically http://notoriousnooch.co and https://fattuesday.com/
Wireframes & Mock-Ups Edited
Gradually developing designs we liked more, in collaboration with our graphic designer, Samara and I workshopped and refined the design ideas. We wanted to develop an interesting scroll pattern, and ensure the website was playfully interactive. We developed to a new horizontal scroll experience, similar to the Notorious Nooch design.As final packaging design was decided on, I ensured that the website design evolved to match/contrast some of the key elements of the packaging. Large clouds, clear affirmative text, and bright color contrasts began to take form as key stylistic elements in the updated mock-ups.
![Final Packaging](https://freight.cargo.site/t/original/i/23dc2deb97ef47a792303c1e62fc0c9a6c44f9bfdf3037e22a94d2d50ef23441/can.png)
Final Packaging
![](https://freight.cargo.site/t/original/i/f871365a9764df235e97b5566fd8fe496cdd37d898dbb7f2e08859983090cd80/Rebrand-Wireframes-V5_Page_03.jpg)
![](https://freight.cargo.site/t/original/i/28c9bfd9bfa94d65b9b0fa7c97305f731a603b7013acfe55073f6f074a9d1bd1/Rebrand-Wireframes-V5_Page_02.jpg)
![](https://freight.cargo.site/t/original/i/b3cf4bb35430a0297c361211e82df6c995e4eace47249be5cdc929c54a4f7e67/Rebrand-Wireframes-V5_Page_06.jpg)
![](https://freight.cargo.site/t/original/i/e3169072cca3e7754ef4f00b7c04c759239c0aad828a7fd7f7d325c2ccc3563d/Rebrand-Wireframes-V5_Page_09.jpg)
![](https://freight.cargo.site/t/original/i/83f21be4b4483c09c81dfc2d0f1888518b3fa5c7824756cb7849bd2b858540e3/Screenshot-2023-05-16-153452.png)
![](https://freight.cargo.site/t/original/i/08a88754f3762e137442b5f5a4da0d544baf62bd06bd4cb9f67847e669b4f1c5/Rebrand-Wireframes-V5_Page_08.jpg)
![](https://freight.cargo.site/t/original/i/9312ae15dc6d97af5d0db81b0b14f725d72bd3f1077cd2db43609e396064d4e4/Rebrand-Wireframes-V5_Page_23.jpg)
![](https://freight.cargo.site/t/original/i/970481db9381dc407f4a5f8d8798edbf729b9a327470dadd5fd1e0f23c432165/Rebrand-Wireframes-V5_Page_24.jpg)
![](https://freight.cargo.site/t/original/i/0aa4a3dba35ea9503914646f5b8ca3f5c6e7581a6dbc8346d8ce9dfa19497ae4/Screenshot-2023-05-16-153208.png)
![](https://freight.cargo.site/t/original/i/4f2c6183197af63eb61702308a39f9d7265c611793295e7d0f56113658507cdb/Rebrand-Wireframes-V5_Page_27.jpg)
Selection of Rebrand Mock-Up Screens - each offering slightly different variations of images, color, and layout.
Final Edits
From these Mock-Ups, and in converstation with our Front-End Developer, Ada Banaszak, I developed the following final edits.
![](https://freight.cargo.site/t/original/i/06258068f93f848d99c74fbd07612255cca13ad62cb95f038f88b47ea098e2f0/IMG_0560.jpg)
![](https://freight.cargo.site/t/original/i/d2e3fdd3bb701276fdd3a00620fdec0e8553df8b4dc4375d2385ba9fbde56dec/IMG_0559.jpg)
![](https://freight.cargo.site/t/original/i/7e302d19a9a7c7ba1839eb3ca0abea1efd532ee6a5b132efae8ecd39a8c1540c/IMG_0558.jpg)
![](https://freight.cargo.site/t/original/i/0ee56b063c8c42bbb0315aa26b60fa139f05f6cd6ebbe64c58bf8655449f3f10/IMG_0578.jpg)
![](https://freight.cargo.site/t/original/i/8ee8865f3835d0a394797a6735e758f2458df35ef6241fa8f77fb7bc36254e42/IMG_0579.jpg)
![](https://freight.cargo.site/t/original/i/701e769011203c8520663b8075f88fd5d931d48e1b7f36329666b2a0204488e9/IMG_0553.jpg)
![](https://freight.cargo.site/t/original/i/9e865b27627e10e16ec31a41ad70faea4930d075c49385fa260ea354cb8c6eae/IMG_0554.jpg)
![](https://freight.cargo.site/t/original/i/1c4c07f20c5444a82f74b427eb3eaa7c693d282024772aa56ee656312ef53962/IMG_0555.jpg)
![](https://freight.cargo.site/t/original/i/e13412adfb15255560e31f0c35ba27961b14bb866186bfcf2850e97b8c99f250/IMG_0556.jpg)
![](https://freight.cargo.site/t/original/i/4f0135c807677b95e0c4acec35a527853536099e94ec186991788033d18d1991/IMG_0557.jpg)
![](https://freight.cargo.site/t/original/i/3b7d7caac61527bac8aeb167d249b22a772ff43f95ff09a762a07e2b225c6b69/IMG_0581.jpg)
![](https://freight.cargo.site/t/original/i/0f52c3e1be0f59cc06f7efec4195b3cc822516f19849a6d6071cd8dbee9a2190/IMG_0594.jpg)
![](https://freight.cargo.site/t/original/i/e6ff2b5d49997fc616f11e44c9defa022a18d6666507176eea20c2b289638534/IMG_0592.jpg)
![](https://freight.cargo.site/t/original/i/bd83693cb456a10316f4da00acb0284dd3a9cd4e3e509e6b159d7c675467d15b/IMG_0569.jpg)
![](https://freight.cargo.site/t/original/i/e605d22cf38ed991f771bb3e8948d49bdf2975867b0560c80cecef6ccddeacab/IMG_0587.jpg)
![](https://freight.cargo.site/t/original/i/fe156acf684a73a1fb241d288e664a39536422e268187ad838d91cf02de3c980/IMG_0593.jpg)
![](https://freight.cargo.site/t/original/i/cd1d528a514d5a24a414e5e548fb38acd15513bc0e95953460c8190cb5cb10ca/IMG_0591.jpg)
![](https://freight.cargo.site/t/original/i/5de0090cd6756995cbd75cb9995bd4d4e0390f56f4dc975e470874ad6e037508/IMG_0590.jpg)
![](https://freight.cargo.site/t/original/i/e68a009001a123b2e3c3c93f855f557364a2465eaea2ace8e5e90fc22d4bf083/IMG_0588.jpg)
![](https://freight.cargo.site/t/original/i/21b00b7b3afb183175e5f369b0308cea9c30c377787c832d08d6fb11295617d9/IMG_0589.jpg)
I worked with Ada as she developed the website, generating new renders of the images and providing design feedback as she worked to make the designs into a functional website. Unfortunately, due to time and web development limitations, we had to update the horizontal scroll idea and develop an interesting vertical, interactive scroll. However, we were happy with the final result.
Check out the final design: https://www.drinkrebrand.com/