This file should eventually be removed, once shakeel.design content is folded into this repo.
<div grid-row="" grid-pad="2" grid-gutter="4">
<div grid-col="8" grid-pad="2"><h2>Words Have Power Installation (prototype)</h2></div>
<div grid-col="4" grid-pad="2"></div>
</div><br>
<div grid-row="" grid-pad="2" grid-gutter="4" grid-responsive="">
<div grid-col="8" grid-pad="2">
<iframe src="https://www.youtube.com/embed/FgXr_smf4yo" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen="" style="aspect-ratio: 16 / 9; width: 100%;" class=""></iframe><br>
This teaser video documents my setup process for the midterm prototype installation.<br>
<br>
<iframe src="https://www.youtube.com/embed/41Fk9HTuJwU" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen="" style="aspect-ratio: 16 / 9; width: 100%;" class=""></iframe><br>
This is a longer form presentation covering the theory, concept, setup, and execution of the installation.<br><br>
{image 19}<br>
The scale of this project was critical to give the viewer an immersive experience. Once I saw the setup with 8ft tall boards, I knew I was onto something special.<br>
<br>{image 7}<br>
Research and inspiration.<br>
<br>{image 14}<br>
Early table top form studies.<br><br>
{image 16}<br>
Initial models at full scale, realizing that sufficient height was necessary for an immersive experience.<br><br>
{image 18}<br>Final build from table-top model to full size.<br>
<br>
{image 8}<br>All visuals were generated through experimentation in TouchDesigner.<br><br>{image 13}<br>
Projection mapping in TouchDesigner.<br>
<br>
{image 9}<br>
<br>
{image 10}<br><br>
{image 11}<br>
<br>{image 12}<br>
</div>
<div grid-col="4" grid-pad="2">
<b>When:</b> 2023<br>
<b>Media: </b>transmedia, coding, installation<br>
<b>Tools:</b> TouchDesigner, Python, projection mapping, model building, microphone<br><br>
<b>Goal:</b> design an installation to reflect on daily life.<br><br>This interactive installation uses projection mapping to visually show the impact of our voice through generative graphics activated by microphone input. Applying graphic design foundations across media types has always interested me, this was the perfect opportunity to explore design in space.<br>
<br>
I was inspired by Masuru Emoto’s research on what happens to water crystals based on what words or music they are exposed to before freezing. I watched his documentary as a child and totally forgotten about it until one day I remembered this reference.<br>
<br>
This project is not done, but I am really pleased with my progress and hope to continue exploring these technologies. Transmedia curriculum is one of the main reasons I chose to attend ArtCenter, and I’m so glad to learn these skills I’ve been thinking about for years!<br>
<br>
<b>Future work:</b> adding key phrase triggers and emotion detection software to provide a significantly more engaging experience.
<br><br>
<b>Special thanks to:</b> Miles Mazzie, and Camille MacRae.<br>
</div>
</div><div grid-row="" grid-pad="2" grid-gutter="4">
<div grid-col="8" grid-pad="2"><h2>Midjourney Strategic Rebrand</h2></div>
<div grid-col="4" grid-pad="2"></div>
</div><br>
<div grid-row="" grid-pad="2" grid-gutter="4" grid-responsive=""><div grid-col="8" grid-pad="2">{image 1}<br>The new Midjourney logo is an evolution of the previous sailboat symbol. “The Sail” places focus on the most important part of a sailboat enabling navigation and speed, both for their team and users. This refined symbol is a reminder of the groundbreaking work they do.<br><br>{image 9}<br>Audit of current brand assets. Through my interviews, I was surprised how many users of Midjourney knew little to nothing about the brand, many had no idea their logo was a sailboat. Though I explored many forms, with Gerardo’s guidance I chose a brand evolution rather than revolution and continued the nautical theme based on interviews with the Founder, David Holz.
<br>
<br>{image 10}<br>There was little information about Midjourney existing brand given how new the company is. My research focused on Founder interviews to get a clear understanding of his mission.<br>
<br>
{image 12}<br>The Sail. After an exhaustive exploration of logo designs, I found a beautiful compromise of abstraction while carrying forward the DNA of their existing logo. The sail is the simplest expression of the sailboat, which connects back to the above quote from David Holz.
<br><br>
{image 13}<br>The brand colors emerged from light refraction, symbolizing expansive creativity possible with their products.
<br><br>
{image 14}<br>These colors aim to connect with a broader audience across cultures, ages, and industries. The primary color palette helps Midjourney stand out from the majority of tech companies.<br><br>
{image 15}<br><div style="text-align: left;">Logo family system expressed through all brand colors: vertical lockup, icon, wordmark.
</div>
<br>{image 16}<br>The abstract intelligence (AI) pattern.<br>
<br>
{image 17}<br>Midjourney stationery system.
<br><br>
{image 18}<br>Promotional posters displayed in the HQ as a reminder of company culture.
<br><br>
{image 19}<br>
Though Midjourney has been a remote company, I wanted to imagine what their first HQ office space might look like. The HQ would feature a brushed stainless steel sculpture of the Midjourney sail outside.<br>
<br>{image 20}<br>I also envisioned Midjourney launching a users conference called Midjourney Navigate, to be held in San Francisco.
<br><br>
{image 21}<br>Keynote stage and various conference merch. At Navigate, Midjourney would announce their new digital platform featuring an iOS app and image generation in browser (evolving from the Discord only experience).
<br>
<br>
{image 5}<br>Promotional posters in context.
<br>
<br>
{image 23}<br>Notable creative leaders would receive VIP invites to the conference, including customized VIP cards, access to 1:1 consultations with AI experts, and an invite to a celebration evening.
<br><br>
{image 24}<br>Midjourney VIP access cards would have digital integration and provide access to VIP lounge areas at the venues.
<br><br>
{image 25}<br>I also explored what form an interactive installation might look like at the conference. Attendees would be able to speak into microphones placed around the installation to generate images from their voice.<br><br>
{image 11}<br>
A selection of identity refinement from paper to digital sketches.</div>
<div grid-col="4" grid-pad="2">
<b>When:</b> 2023 (in progress)<br>
<b>Media:</b> branding, strategy, website, motion, 3D, transmedia, augmented reality, website, mobile app, packaging, installation<br>
<b>Tools:</b> InDesign, Illustrator, Figma, AfterEffects, Blender, Midjourney, Photoshop<br><br><b>Goal:</b> reimagine a brand to be more approachable and aligned with their mission through design.<br><br>
<b>Typefaces:</b> Clash Display and Clash Grotesk from Indian Type Foundry.<br><br>
Disclaimer: this is a work in progress student project at ArtCenter College of Design.<br><br>
For more information, please reach out at: <b><a href="mailto:[email protected]">[email protected]</a></b>.<br><br>
I re-imagined the identity of Midjourney across a wide range of touchpoints including digital, print, conference, wayfinding, a new corporate headquarters, and much more.<br><br>
<b>“How do you build these boats that let them navigate and be empowered and sort of sail the ocean of imagination, instead of just drowning?”.
<br>
(Founder, David Holz).</b><br>
<br>
The new Midjourney logo is an evolution of the previous sailboat symbol. This refined symbol is a reminder of the groundbreaking work they do within generative AI.<br>
<br>
The new brand colors are inspired by light refraction, symbolizing the expansive creativity possible with our products. These colors aim to connect with a broader audience across cultures, and industries.<br><br>
The underlying strategy is rooted in remaining competitive with the many new generative AI companies emerging since 2021. <br><br><b>Special thanks to:</b> Gerardo Herrera and Miles Mazzie.<br>
</div>
</div><div grid-row="" grid-pad="2" grid-gutter="4">
<div grid-col="8" grid-pad="2"><h2>digital anarchy: a history of internet piracy</h2></div>
<div grid-col="4" grid-pad="2"></div>
</div><br>
<div grid-row="" grid-pad="2" grid-gutter="4" grid-responsive="">
<div grid-col="8" grid-pad="2">
{image 1}<br><br>
{image 6}<br><br>
{image 2}<br><br>
{image 3}<br>
<br>{image 4}<br>
<br>
{image 5}<br>
</div>
<div grid-col="4" grid-pad="2">
<b>When:</b> 2023 <br>
<b></b>
<b>Media: </b>exhibition, editorial, posters<br>
<b>Tools:</b> InDesign, Illustrator, Photoshop<br><br>
digital anarchy is a hypothetical exhibition about the history of internet piracy. I designed 64 page digital tabloid newsprint publication, along with a set of three posters, and an exhibition title wall. <br><br>
Visual elements were inspired by early the early days of the Internet including: Windows 98 UI aesthetics, browser frames, pixelation, corrupted text, and intersecting linear graph lines representing connectivity.<br><br>
Future work may include motion graphics, generative typography, 3D modeling, and continued build out of the exhibition.<br><br><b>Special thanks to:</b> Simon Johnston, Lavinia Lascaris, Noah Cousineau, Cheri Gray, and Shuwen Ding.<br>
</div>
</div><div grid-row="" grid-pad="2" grid-gutter="4">
<div grid-col="8" grid-pad="2"><h2>Referential Mono Typeface</h2></div>
<div grid-col="4" grid-pad="2"></div>
</div><br>
<div grid-row="" grid-pad="2" grid-gutter="4" grid-responsive=""><div grid-col="8" grid-pad="2">
{image 22}<br>
<br>{image 19}<br><br>
{image 13}<br>
<br>{image 14}<br>
<br>
{image 15}<br>
<br>{image 16}<br>
<br>
{image 20}<br>
<br>{image 17}<br><br>
{image 21}<br>
<br>
{image 18}<br><br>
{image 23}<br>
I began designing the Arabic character set which has a different set of complexities. In this first draft I remained rigid to the same grid as the Latin character set (7x7 without letter-spacing since Arabic is a connected script). In doing so, I found some forms do not reduce down as nicely as I would like. The next revision I will try is on a 14x14 grid, subdividing the current grid in half.</div>
<div grid-col="4" grid-pad="2">
<b>When:</b> 2023 <br>
<b>Media: </b>type design<br>
<b>Tools:</b> Glyphs, Illustrator, InDesign, Figma<br><br>
<b>Goal:</b> design a modular typeface, infused with personal meaning.<br><br>
<b>Recognition:</b> Hoffmitz Milken Center for Typography (HMCT) Newsletter 2023 holiday greetings (featured typeface).<br><br>
Referential Mono is built on a 5x5 grid, inspired by early computing and Islamic History. As a developer and Muslim, this project was an opportunity to combine many aspects of my identity in one.<br>
<br><a href="https://hmctartcenter.org/" target="_blank">HMCT</a> graciously featured the typeface in their December 2023 holiday greeting email newsletter.<br><br>
Ongoing work includes: an Arabic version, motion design, and generative typography.<br><br>
<b>Special thanks to:</b> Simon Johnston, Lavinia Lascaris, Noah Cousineau, with additional feedback from Milka Broukhim, Greg Lindy of Lux Typo, and Wael Morcos.<br>
</div>
</div><div grid-row="" grid-pad="2" grid-gutter="4">
<div grid-col="8" grid-pad="2"><h2>Midjourney Strategic Rebrand</h2></div>
<div grid-col="4" grid-pad="2"></div>
</div><br>
<div grid-row="" grid-pad="2" grid-gutter="4" grid-responsive=""><div grid-col="8" grid-pad="2">{image 1}<br>The new Midjourney logo is an evolution of the previous sailboat symbol. “The Sail” places focus on the most important part of a sailboat enabling navigation and speed, both for their team and users. This refined symbol is a reminder of the groundbreaking work they do.<br><br>{image 9}<br>Audit of current brand assets. Through my interviews, I was surprised how many users of Midjourney knew little to nothing about the brand, many had no idea their logo was a sailboat. Though I explored many forms, with Gerardo’s guidance I chose a brand evolution rather than revolution and continued the nautical theme based on interviews with the Founder, David Holz.
<br>
<br>{image 10}<br>There was little information about Midjourney existing brand given how new the company is. My research focused on Founder interviews to get a clear understanding of his mission.<br>
<br>
{image 12}<br>The Sail. After an exhaustive exploration of logo designs, I found a beautiful compromise of abstraction while carrying forward the DNA of their existing logo. The sail is the simplest expression of the sailboat, which connects back to the above quote from David Holz.
<br><br>
{image 13}<br>The brand colors emerged from light refraction, symbolizing expansive creativity possible with their products.
<br><br>
{image 14}<br>These colors aim to connect with a broader audience across cultures, ages, and industries. The primary color palette helps Midjourney stand out from the majority of tech companies.<br><br>
{image 15}<br><div style="text-align: left;">Logo family system expressed through all brand colors: vertical lockup, icon, wordmark.
</div>
<br>{image 16}<br>The abstract intelligence (AI) pattern.<br>
<br>
{image 17}<br>Midjourney stationery stystem.
<br><br>
{image 18}<br>Promotional posters displayed in the HQ as a reminder of company culture.
<br><br>
{image 19}<br>
Though Midjourney has been a remote company, I wanted to imagine what their first HQ office space might look like. The HQ would feature a brushed stainless steel sculpture of the Midjourney sail outside.<br>
<br>{image 20}<br>I also envisioned Midjourney launching a users conference called Midjourney Navigate, to be held in San Francisco.
<br><br>
{image 21}<br>Keynote stage and various conference merch. At Navigate, Midjourney would announce their new digital platform featuring an iOS app and image generation in browser (evolving from the Discord only experience).
<br>
<br>
{image 5}<br>Promotional posters in context.
<br>
<br>
{image 23}<br>Notable creative leaders would receive VIP invites to the conference, including customized VIP cards, access to 1:1 consultations with AI experts, and an invite to a celebration evening.
<br><br>
{image 24}<br>Midjourney VIP access cards would have digital integration and provide access to VIP lounge areas at the venues.
<br><br>
{image 25}<br>I also explored what form an interactive installation might look like at the conference. Attendees would be able to speak into microphones placed around the installation to generate images from their voice.<br><br>
{image 11}<br>
A selection of identity refinement from paper to digital sketches.</div>
<div grid-col="4" grid-pad="2">
<b>When:</b> 2023 (in progress)<br>
<b>Media:</b> branding, strategy, website, motion, 3D, transmedia, augmented reality, website, mobile app, packaging, installation<br>
<b>Tools:</b> InDesign, Illustrator, Figma, AfterEffects, Blender, Midjourney, Photoshop<br><br><b>Goal:</b> reimagine a brand to be more approachable and aligned with their mission through design.<br><br>
<b>Typefaces:</b> Clash Display and Clash Grotesk from Indian Type Foundry.<br><br>
Disclaimer: this is a work in progress student project at ArtCenter College of Design.<br><br>
For more information, please reach out at: <b><a href="mailto:[email protected]">[email protected]</a></b>.<br><br>
I re-imagined the identity of Midjourney across a wide range of touchpoints including digital, print, conference, wayfinding, a new corporate headquarters, and much more.<br><br>
<b>“How do you build these boats that let them navigate and be empowered and sort of sail the ocean of imagination, instead of just drowning?”.
<br>
(Founder, David Holz).</b><br>
<br>
The new Midjourney logo is an evolution of the previous sailboat symbol. This refined symbol is a reminder of the groundbreaking work they do within generative AI.<br>
<br>
The new brand colors are inspired by light refraction, symbolizing the expansive creativity possible with our products. These colors aim to connect with a broader audience across cultures, and industries.<br><br>
The underlying strategy is rooted in remaining competitive with the many new generative AI companies emerging since 2021. <br><br><b>Special thanks to:</b> Gerardo Herrera and Miles Mazzie.<br>
</div>
</div><div grid-row="" grid-pad="2" grid-gutter="4">
<div grid-col="8" grid-pad="2"><h2>Mark Rothko: Art for Mystics Book</h2></div>
<div grid-col="4" grid-pad="2"></div>
</div><br>
<div grid-row="" grid-pad="2" grid-gutter="4" grid-responsive="">
<div grid-col="8" grid-pad="2">
<iframe style="border: 1px solid rgb(119, 119, 119); aspect-ratio: 16 / 9; width: 100%;" src="https://indd.adobe.com/embed/0ce1fbfe-ae15-462d-b89c-fc8d21c9b685?startpage=1&allowFullscreen=false" frameborder="0" allowfullscreen=""></iframe><br>
The complete book is available for viewing above.<br>
<br>
<div class="image-gallery" gid="1">
{image 31}
{image 21}
{image 22}
{image 23}
{image 24}
{image 25}
{image 26}
{image 27}
{image 28}
{image 29}
{image 30}
{image 32}
</div>
</div>
<div grid-col="4" grid-pad="2">
<b>When:</b> 2022<br>
<b>Professor:</b> <a href="http://morindesignoffice.com/" target="_blank">Christian Perez-Morin</a><br>
<b>Course:</b> Graduate Studio 1, ArtCenter<br>
<b>Media:</b> branding, editorial, book<br>
<b>Tools:</b> InDesign, Photoshop, Illustrator<br><br>
<b>Subject:</b> Mark Rothko, abstract expressionist painter<br>
<b>Goal:</b> Design a book to accompany the documentary campaign demonstrated in<a href="Mark-Rothko-Documentary-Campaign" rel="history"> the previous project</a>.<br>
<b>Title:</b> Mark Rothko: Art for Mystics.<br>
<b>Cover:</b> Stark off-white, reminiscent of mass market religious texts. People often feel unexpected emotions in front of Rothko paintings. To me, these are mystical experiences.<br>
<b>Typeface:</b> Neue Haas Grotesk was chosen to embody the crystal goblet concept, letting the content speak for itself.<br>
<br>
Colors were inspired by the Rothko Chapel in Houston, Texas. The non-denominational Chapel was one of Rothko’s final projects which he never saw completed.<br>
<br>
Intro/outro: A few spreads guide the reader from from the everyday material world to that of the mystical, symbolized by a slow gray to purple gradient. The outro follows the sequence in reverse. This concept is based on an engawa, a Japanese architecture element to bridge the outside world to the home.<br><br>
Each chapter begins with a full spread. The chapter title is large, paired with a relevant Rothko quote on the opposite page.<br>
<br>
<ol><li><b>Preface</b> — an introduction to Mark Rothko.<br></li><li><b>
Search</b> — early explorations through lesser known styles of art.<br></li><li><b>
Voice</b> — a photo essay of his best known abstract works.<br></li><li><b>
Wisdom</b> — his advice for new artists.<br></li><li><b>
Legacy</b> — an interview with Christopher Rothko, his son, which informed my overall design direction.<br></li><li><b>
Reflection</b> — my brief and emotional editorial capturing my thoughts as I completed the book.<br></li></ol>
<br>
In the end, I found my 74 page book was not enough to convey the impact of one person’s life. Let alone a 500 page book.
<br>
<br>
Special thanks to the National Gallery of Art for providing high quality images of Rothko’s artwork, and to Architectural Digest for a beautiful photo of the Rothko Chapel.
<br>
</div>
</div><div grid-row="" grid-pad="2" grid-gutter="4">
<div grid-col="8" grid-pad="2"><h2>TYPO Mexico City Conference Identity</h2></div>
<div grid-col="4" grid-pad="2"></div>
</div><br>
<div grid-row="" grid-pad="2" grid-gutter="4" grid-responsive="">
<div grid-col="8" grid-pad="2">
{image 1}<br>
<br>{image 10}<br>
<br>
<video width="1920" height="1080" controls="" style="aspect-ratio: 16 / 9;">
<source src="https://files.cargocollective.com/c1603295/widescreen.mp4" type="video/mp4">
</video>
<br><br>
{image 3}<br><br>
{image 4}<br><br>
{image 5}<br><br>
<br>
{image 6}<br><br>
{image 7}<br><br>
{image 8}<br>
</div>
<div grid-col="4" grid-pad="2">
<b>When:</b> 2023<br>
<b>Media:</b> branding, poster, t-shirt, augmented reality, motion<br>
<b>Tools:</b> InDesign, Illustrator, Artivive, After Effects<br><br><b>Goal:</b> design an identity for a typography conference, embracing the idea of a post-pandemic community building.<br><br>
<b>Typefaces:</b> Yink from Eclectotype and Ofelia from Blackletra.<br>
<br>
TYPO is a fictional typography conference identity design project.<br>
<br>We were tasked with selecting a list of typographers to feature for the conference, designing a wordmark, 3' x 6' feet posters (huge), t-shirts, name badges… oh and we were restricted to black and white!<br><br>
I also designed: stickers and an augmented reality motion poster with a direct call to action to register for the conference.<br>
<br>
Conferences are about the exchange of ideas and perspectives, design conferences should also be great fun. I chose this playful arrangement of curved organic letterforms to symbolize these concepts.<br><br>
The conference venue, Museo Tamayo Arte Contemporáneo, has a sharp, brutalist architectural style. My identity design embraces the human aspect of the design community by contrast.<br><br>
I envision conference organizers and staff wearing black shirts to not draw attention to themselves backstage. Attendees would receive white shirts when checking in on the first day of the conference. <br>
<br>
<br>
<b>Special thanks to:</b> River Jukes-Hudson, Noah Cousineau, Cheri Gray, Shuwen Ding, and Shengjie Wu, and the great audience at Type Thursday LA for additional critique.<br>
</div>
</div><div grid-row="" grid-pad="2" grid-gutter="4">
<div grid-col="8" grid-pad="2"><h2>2022 AIGA Portfolio Festival</h2></div>
<div grid-col="4" grid-pad="2"></div>
</div>
<div grid-row="" grid-pad="2" grid-gutter="4" grid-responsive="">
<div grid-col="8" grid-pad="2">
<iframe src="https://www.youtube.com/embed/HtRtGYQx480" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen="" style="aspect-ratio: 16 / 9; width: 100%;"></iframe><br>
<br>
{image 2}<br></div>
<div grid-col="4" grid-pad="2">
<b></b><b>When:</b> July 2022<br>
<b>Reviewer:</b> Louise Sandhaus<br>
<b>Organization:</b> <a href="https://aiga.org" target="_blank">AIGA</a><br>
<b>Media:</b> presentation
<br>
<b>Tools:</b> Keynote, InDesign, Photoshop, Illustrator<br><br>
<b>Topic:</b> One Year Can Change Your Whole life.<br>
<br><b>Recognition:</b> I presented my portfolio live to all Festival attendees over Zoom, where I received valuable feedback from Louise Sandhaus.<br>
<br>
After my initial portfolio review at the 2021 AIGA Portfolio Festival, I recognized the need to improve my work to align with my career aspirations. One year later, at the 2022 Festival, I shared my growth journey, which ultimately led to my acceptance into ArtCenter's Graphic Design MFA program.<br>
<br>
Months later, at the 2022 AIGA National Design Conference in Seattle, I had the pleasure of meeting Louise and Ace, another designer whose work she reviewed during the Festival.<br><br>
The recording is available on <a href="https://youtu.be/HtRtGYQx480" target="_blank">YouTube</a>.</div>
</div><br><div grid-row="" grid-pad="2" grid-gutter="4">
<div grid-col="8" grid-pad="2"><h2>Salgirah International Festival Identity</h2>
</div>
<div grid-col="4" grid-pad="2"></div>
</div><br>
<div grid-row="" grid-pad="2" grid-gutter="4" grid-responsive=""><div grid-col="8" grid-pad="2">
<br>
<br>{image 2}<br>Full-color logo. The colors come from the Ismaili community’s flag, seen in the photograph of His Highness the Aga Khan (below).
<br>
<br><iframe src="https://www.youtube.com/embed/J4gO_TFNdxw" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen="" style="aspect-ratio: 16 / 9; width: 100%;" class=""></iframe><br>This is a mini-reel of all motion graphics I worked on for #Salgirah85. These animations were used across social media, opening slates for various forms of video content for the festival, and on stage at some live events. Music was selected by The Ismaili Sounds global team.
<br>
<br>
<iframe src="https://www.youtube.com/embed/HtRtGYQx480?t=375s" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen="" style="aspect-ratio: 16 / 9; width: 100%;" class=""></iframe><br>
Above is the recording of my presentation of this project (at 6:15) from the 2022 AIGA Portfolio Festival.<br><br>
{image 17}<br>
<br><br>
{image 3}<br>Here, His Highness the Aga Khan is pictured in front of the Canadian and Ismaili flags at the Global Centre for Pluralism in Ottawa, Canada.
<br><br>
{image 4}<br>Five Ring Motif. The motif is my take on Islamic geometric design. Initially, you see three rings of 17 diamonds. In the negative space between them, two additional rings are created for a total of five total rings of 17 (17x5 = 85). One diamond representing each year of His Highness’ life.<br>
<br>
{image 18}<br>
Initially, you see three rings of 17 diamonds. In the negative space between them, two additional rings are created for a total of five total rings of 17 (17x5 = 85). One diamond representing each year of His Highness’ life.<br>
{image 5}<br>The three rings are inspired by the three nuktas (dots) above the first letter in the Arabic word, shukr, meaning gratitude. The rings in negative space are a reminder of the esoteric aspects of the Ismaili faith.<br>
{image 6}<br>Additional logo variations. The system works in full color on white backgrounds, or in white on red or green backgrounds.
<br><br>
{image 7}<br>Brand pattern. Designed by deconstructing the motif to an individual diamond and tiling them infinitely. These forms create an interesting 2.5D illusion.<br>
<br>{image 19}<br>The geometry of 86 didn’t resolve so nicely as 85. The following year I got a call after the global team realized they couldn’t simply “add another diamond” for that year’s identity.<br><br>
{image 20}<br>Ultimately we realized the geometry of 86+ would be problematic, and chose to pivot and build the identity around 49 (as the Aga Khan is the 49th hereditary spiritual leader in this role). We settled on a new 7 ring motif (4 visible, 3 in negative space).
<br>
{image 21}<br>Secondary lockups for years 86-89. I wanted these elements to live separately from the primary 7 ring motif as these next 4 years were “non-milestone” years. I look forward to revisiting this identity for a refresh for the Aga Khan’s 90th Salgirah!<br><br>
{image 22}<br>
<br>
{image 8}<br>After delivering all brand assets, social media teams in the Ismaili community launched global, national, and regional digital marketing campaigns. These assets (social media content, videos, website) were created by many talented people around the world in multiple languages. I have included them here to show the context and impact of the brand identity.<br>
<br>
{image 9}<br>Photo backdrop in Atlanta, Georgia, USA. Designed by the local team.
<br><br>
{image 10}<br><div style="text-align: left;">Retirement home celebrations in Calgary, Canada. Designed by the local team.
</div>
<br>{image 11}<br>Wow. I didn’t even know they had access to large scale printing in the mountainous region of Hunza, Pakistan. Designed by the local team.
<br><br>
{image 12}<br>I never expected a logo I designed to be on a cake! (Or sherbet bottle, a milk-based drink made for special occasions). Houston, Texas, USA. Designed by the local team.<br><br>{image 1}<br>Dubai World Trade Centre. The Ismaili community in Dubai, UAE held their first in-person celebration since the COVID-19 pandemic at the Dubai WTC. Unfortunately I was not able to attend for multiple reasons, but received some photos from the local team. All assets were designed by the local team in Dubai.<br>
<br>{image 16}<br>
Exterior signage.<br><br>
{image 13}<br>Branding displayed on stage during musical performances. Designed by the local team.
<br>
<br>{image 14}<br>Signage for Golden Members (elders in the community, 65+), and wristbands to enter the venue. Designed by the local team.<br>
<br>
{image 23}<br>The local team in Seattle told me about their ambitious design plans for the celebration, and that I had to be there to see my design come to life at the venue. Returning to Seattle the weekend before finals in my first term... we had a lovely hometown celebration with cultural dance performances, dinner, and a live band.<br>
<br>
{image 24}<br>Despite my intense workload for the last few days of the semester, I made a last-minute decision to take a 36-hour trip back home in secrecy. It was the first time I could physically see anything I’d designed at this scale. In my hometown no less.<br><br>
{image 25}<br>The stage in Seattle, with the live band’s equipment. Beautifully assembled by the local team.<br><br>
{image 26}<br>The local team surprised me with this floating sculpture of the 7 ring motif, suspended over the dance floor!<br><br>
{image 27}<br>Group photo with the photo/video team.<br>
<br>{image 28}<br>Kitchen volunteers with branded aprons.<br><br>
{image 29}<br>Family portraits in Seattle for the 87th Salgirah (December 2023).
<br>
</div>
<div grid-col="4" grid-pad="2">
<b></b><b>When: </b>2021–present (annually)<br>
<b>Organization:</b> <a href="https://the.ismaili/" target="_blank">The Ismaili Community</a> (globally)<br>
<b>Media:</b> Branding, Motion<br>
<b>Tools:</b> Illustrator, InDesign, AfterEffects, Photoshop <br><br><b>Goal:</b> Design a unified festival identity for the global Ismaili Muslim community in 21 countries.<br><br>
Salgirah is a religious festival observed by Ismaili Muslims every December. It marks the birthday of His Highness the Aga Khan, a descendant of Prophet Muhammad, the spiritual leader of 15 million Ismailis worldwide. December 13, 2021, marked his 85th birthday, or Salgirah.<br><br>The brief given to me by the Ismaili global communications team was to embrace the theme of shukr (gratitude in Arabic) while conveying 85 through (Islamic) geometry. This brand identity would be used worldwide by the Ismaili community to promote a sense of unity.
<br>
<br>This was by far the largest project I’ve worked on in terms of scale and one I will remember forever. The team only had two brief Zoom meetings over the six weeks of the project. I was impressed with our ability to collaborate across timezones through a Whatsapp group. Since this is a faith-based organization, all team members involved shared a common belief system about the festival.<br><br>
One year later I was invited to refresh the identity for the Aga Khan’s 86th Salgirah festival. This became a flexible system to be used for the next three years.<br><br>
<b>Special thanks to:</b> the dozens of volunteers who applied the identity system across many media types around the world.</div>
</div><br><div grid-row="" grid-pad="2" grid-gutter="4">
<div grid-col="8" grid-pad="2"><h2>86th Salgirah Festival Identity</h2></div>
<div grid-col="4" grid-pad="2"></div>
</div><br>
<div grid-row="" grid-pad="2" grid-gutter="4" grid-responsive=""><div grid-col="8" grid-pad="2">
{image 1}<br>
Community members from Afghanistan performed a traditional dance at the celebrations in Seattle.<br>
<br>
{image 2}<br>
The primary logo lockup in a vertical orientation to honor the new motif.<br>
{image 3}<br>
A secondary horizontal lockup was developed to emphasize the number 86.<br>
<br>
{image 4}<br>
The local decor team in Seattle beautifully applied the identity to a photobooth and various elements at the venue.<br>
<br>
{image 5}<br>
Stage backdrop and lighting designed by the local decor team in Seattle.<br><br>
{image 6}<br>A floating installation of the motif hanging over the dance floor, designed by local decor team in Seattle. I was told this took nearly six hours to assemble and hang.<br>
<br>{image 7}<br>
I had the opportunity to support the local photography team on my quick trip up to Seattle.<br>
<br>
{image 8}<br>
Volunteer badges designed by the local team in Seattle.<br><br>
{image 14}<br>
Aprons worn by the kitchen staff, designed by the local team in Seattle.<br>
<br>{image 10}<br>
Cakes! These were found on social media accounts.<br>
<br>
{image 12}<br>
Children’s celebrations, I believe this was in East Africa.<br><br>
{image 13}<br>
Additional celebrations in Pakistan.</div>
<div grid-col="4" grid-pad="2">
<b></b><b>When:</b> December 2022 (6 days)<br>
<b>Organization:</b> <a href="https://the.ismaili/" target="_blank">The Ismaili Muslim Community (globally)</a>
<br>
<b>Media:</b> branding<br>
<b>Tools:</b> Illustrator, Photoshop, InDesign<br><br><b>Goal:</b> Quickly adapt my identity design from the previous year without disrupting the established geometry.<br><br>Salgirah is a religious festival observed by Ismaili Muslims every December. It marks the birthday of His Highness the Aga Khan, a descendant of Prophet Muhammad, the spiritual leader of 15 million Ismailis worldwide. December 13, 2022, marked his 86th birthday, or Salgirah. For additional context, please read through <b><a href="Salgirah85-International-Festival-Branding" rel="history">the identity I designed from the previous year</a></b>.<br><br>
The main challenge in designing this year’s identity was finding a way to represent the number 86 with geometry in the logo. From the previous year, 85 had easy multiples to work with (7 x 15) however 86 could only be broken down to 43 x 2 which does not lead to a pleasing form.<br><br>
After discussions with international marketing leadership, I was given permission to explore the number 49 instead. His Highness the Aga Khan is recognized as the the 49th Ismaili Muslim Imam and a direct descendant of the Prophet Muhammad. 49 breaks down nicely into 7x7 and offered the opportunity to reuse the identity for future years.<br><br><div style="text-align: left;">The local team in Seattle told me about their ambitious design plans for the celebration, and that I had to be there to see my design come to life at the venue. Despite my intense workload for the last few days of the semester, I made a last-minute decision to take a 36-hour trip back home in secrecy. It was the first time I could physically see anything I’d designed at this scale. In my hometown no less.</div></div>
</div><br><div grid-row="" grid-pad="2" grid-gutter="4">
<div grid-col="8" grid-pad="2"><h2>Hadhan Coffee Packaging (in progress)</h2></div>
<div grid-col="4" grid-pad="2"></div>
</div><br>
<div grid-row="" grid-pad="2" grid-gutter="4" grid-responsive="">
<div grid-col="8" grid-pad="2" class="">
<div class="image-gallery" gid="7">
{image 2}
</div>
</div>
<div grid-col="4" grid-pad="2">
<b>When:</b> 2023 (in progress)<br>
<b>Media:</b> packaging, branding<br>
<b>Tools:</b> InDesign, Photoshop, Illustrator<br><br>
Hadhan Coffee Roasting Co. is a captivating hypothetical brand that takes you on a sensory journey with every sip. The name comes from the Arabic word for “hug”, symbolizing the feeling of comfort from a warm cup of coffee.<br>
<br>
Targeting the diverse city of Toronto, Hadhan's specialty beans are sourced from countries with significant importance in the Islamic history. The brand's unique varietals are packaged in bags that showcase distinctive Islamic patterns from the beans' country of origin or roast.<br>
<br>
During my research, I discovered a connection between the origins of coffee and Islamic countries, which added a layer of storytelling to the project. While coffee beans originated in Ethiopia, it was the mystics in Yemen who first recognized and consumed them for their energizing properties. This project expanded beyond just packaging and transformed into a brand that shares the untold and fascinating history of coffee from Islamic countries.<br><br>
Through expert interviews, I received invaluable feedback from subject matter experts in packaging design, history of coffee in Islamic countries, and native<br><br>
Ongoing revisions:<br>
<ul><li>Hand lettering for primary logotype</li><li>Revised brand story</li><li>Expanded brand applications (posters, t-shirts, coffee mugs)</li></ul><br>
<b>Special thank to:</b> Daniel Hoy, Tori Kwon, Milka Broukhim, Wael Morcos.</div>
</div><div grid-row="" grid-pad="2" grid-gutter="4">
<div grid-col="8" grid-pad="2"><h2>SHE WILL: Malala Fund x Timex</h2></div>
<div grid-col="4" grid-pad="2"></div>
</div><br>
<div grid-row="" grid-pad="2" grid-gutter="4" grid-responsive="">
<div grid-col="8" grid-pad="2">
{image 8}<br><br>
<video width="1920" height="1080" controls="" style="aspect-ratio: 16 / 9;" poster="https://freight.cargo.site/t/original/i/c20db3454ad0ef53fd86635ce4d687ad5df94de6c773bf599ac2b14747b804d6/thumb.png">
<source src="https://files.cargocollective.com/c1603295/HMCT_SHE_WILL_edit_01.mp4" type="video/mp4">
</video>
<br>
Two posters from the series were installed at the Hoffmitz Milken Center for Typography (HMCT) Billboards at ArtCenter College of Design.<br>
<br>{image 10}<br>
The full poster series.<br><br>
{image 11}<br>
Posters 2, 4, 6, and 8 tell the story of Simran, a young girl from Pakistan, in the smaller type available upon closer inspection.<br><br>
{image 13}<br>Selected type as image explorations, done in positive and negative. <br><br>
{image 12}<br>Plan view of the pop-up exhibition, inspired by the forms of infinity and a watch dial.
<br><br>
<video width="1920" height="1080" controls="" style="aspect-ratio: 16 / 9;">
<source src="https://files.cargocollective.com/c1603295/She_Will_flythrough_v2.mp4" type="video/mp4">
</video>
<br>A very rough fly through of the pop-up exhibition, designed in Blender. This was the biggest 3D project I’ve done, and want to keep exploring this area further.
<br>
</div>
<div grid-col="4" grid-pad="2">
<b>When:</b> 2024 (in progress)<br>
<b>Media:</b> posters, messaging, spatial, 3D modeling<br>
<b>Tools:</b> InDesign, Illustrator, p5.js, AfterEffects, Blender, Midjourney, Photoshop<br><br><b>Goal:</b> reinterpret the message of a non-profit organization through the perspective of a lifestyle brand for a new audience.<br><br>
<b>Recognition:</b> ArtCenter Student Gallery, Hoffmitz Milken Center for Typography (HMCT) Billboards<br><br>Tasked with imagining a collaboration between a lifestyle brand and non-profit organization, I chose Malala Fund and Timex. Malala Fund is an advocacy non-profit for girls’ education in middle-income and low-income counties (which they prefer to use instead of “third-world”) founded by Malala Yousafzai. Timex is one of the most ubiquitous watch brands. Together, this exhibition is targeting young professionals in SoCal with a key unifying factor of empowerment and time.<br><br>
I chose to use Midjourney generated images to demonstrate how as visual communicators we can convey a message without putting someone in harm’s way. In particular, <a href="https://en.wikipedia.org/wiki/Afghan_Girl" target="_blank">Sharbat Gula</a> (the “Afghan Girl” from National Geographic) was put in danger after her photograph became so broadly known.<br><br>A key finding emerged through research: both organizations are united by the idea of 12.<br>– Malala Fund: “Twelve years of education”<br>– Timex: 12 hours per AM and PM<br>
<br>
Though very much in progress, this notion of 12 will inform the rest of the physical exhibition layout and perhaps two more posters.<br><br>
<b>Future work includes: </b><br>
– Improved content sequence and environmental design in the exhibit<br>
– Placing the exhibit in space, I am considering venues around Washington D.C.<br>
– A polished fly through video, there are several rough points<br>
– More complete generative design integrations, and standalone gendesign experiences<br>
– Custom watch dial design, I already have a base 3D model to work from. This 3D model can then be placed at the perimeter of the exhibit<br><br><b>Special thanks to:</b> Tyrone Drake.<br>
</div>
</div><div grid-row="" grid-pad="2" grid-gutter="4">
<div grid-col="8" grid-pad="2"><h2>Mindful Roman Typeface</h2></div>
<div grid-col="4" grid-pad="2"></div>
</div><div grid-row="" grid-pad="2" grid-gutter="4" grid-responsive=""><div grid-col="8" grid-pad="2">{image 15}<br>
<br>
{image 9}<br>
Poster concept: astrology chart for the birth date & time of the typeface.<br>
<br>
{image 10}<br><br>
{image 12}<br><br>
{image 11}<br><br>
{image 13}<br><br>
{image 14}<br>
<br>
{image 8}<br>
<br>
{image 16}<br>
WIP file in Glyphs 3.</div>
<div grid-col="4" grid-pad="2">
<b>When:</b> 2024<br>
<b>Media: </b>type design, posters<br>
<b>Tools:</b> Glyphs, Illustrator, InDesign, Figma<br><br><b>Goal:</b> design typeface strongly informed by historical and contemporary references with a specific theme in mind.<br>
<br>Mindful Roman is a rationally drawn transitional sans-serif typeface for those embarking on a spiritual journey.<br><br>
Typeface references include: Ingeborg, Corporate A, Times New Roman, and Century Schoolbook.<br><br>I aim to replace Corporate A with Mindful Roman for my name in any identity pieces for my personal brand (website, resume, business cards, etc). <br><br>
Future work includes: refined spacing, kerning pairs, sample print applications, and an italic variant.<br><br>
<b>Special thanks to:</b> Greg Lindy of Lux Typo, Jose Caballer. Additional thanks to Co-Star Astrology for copy used on the poster.<br><br>
</div>
</div>