Brand Identity and Website

PROCESS • UX + Market Research • Brand Development • Logo Design • Website Development • Brand Book The Alleyway is an online storytelling platform that explores what it means to practice allyship. Founded by Camaryn Alejandra, this platform is meant to use the intersection of social media & content creation to explore topics related to identity, environmentalism, and social justice, ultimately with the goal of making space for nuanced conversations about society and collective action. I was a designer on a team of 4 designers and 3 developers. Over the course of four months, we developed a unique brand identity and interactive website for The Alleyway. Through a series of design sprints, we explored competitors, developed a logo and custom iconography, iterated wireframes, and tested prototypes. Our deliverables included a complete Brand Package, Brand Book, hi-fi wireframes, and a functional prototype for existing pages. UX + MARKET RESEARCH We began the project with research focused on both strategy and user experience. As a team, we explored competitors and adjacent platforms in the realm of online journals, storytelling, and socially driven content spaces, analyzing their strengths, shortcomings, and engagement patterns to better understand the landscape we were designing within. Simultaneously, we gathered visual inspiration for the site’s overall look, feel, and interactivity, helping us define an experience that felt expressive, contemporary, and aligned with The Alleyway’s mission. Alongside our competitive and visual research, we brainstormed a wide range of potential user features, then prioritized them based on feasibility, usability, and audience needs. We also conducted user interviews to gain insight into how people engage with socially conscious content online and what would make them feel encouraged to explore, reflect, and participate in nuanced conversations. Using these findings, we developed key user stories and a prioritized feature set that informed the site architecture, functionality, and overall user experience moving forward. BRANDING EXERCISES + NAME To define the brand’s personality/functional direction, we facilitated a series of branding exercises with our client, including personality levers, card sorting, and discussions around tone, behavior, and user experience. These exercises clarified how the platform should feel - balancing openness, reflection, and approachability - while also shaping how users would intuitively navigate and engage with the space. Using these insights, we explored naming directions that reflected both conceptual grounding and user experience. Two concepts emerged: “Spire,” evoking aspiration and the Renaissance-inspired visual references shared by the client, and “The Alleyway,” a metaphor for “allyship” that also suggested an inviting path for storytelling and discovery within communities. We validated both directions through the client’s Instagram audience, where feedback consistently favored “The Alleyway,” which we ultimately selected as the final name. VISUAL DIRECTION We began establishing the visual direction by developing three distinct moodboards: one focused on refined, warm details, another more organic and natural, and a third that was brighter and more structured. We aligned with the client on the first direction. From there, we explored two strategies - Minimal Renaissance and Effortless Elegance - ultimately refining into Modern Renaissance as the strongest fit. This direction emphasized a delicate, contemporary aesthetic with a clean, understated system that kept contributor content at the center. We also developed a complementary earthy color palette to reinforce a calm, inviting tone. FINDING THE SPARK In order to continue developing a distinct aesthetic, we created branded elements to use throughout the website. I created this 8-pointed star, or "spark" as we called it - the delicacy along with the meaning behind the word allowed it to serve as a symbolic element for the brand. From here, I used this spark to create two more unique navigational elements - horizontal clickable arrows which are derived from slices of the original spark, and vertical arrows-like graphics that move subtly to guide the viewer down a page. Some more key brand elements that I ideated included the arch and ellipses, to be used in tandem with imagery. These served as symbolic elements to tie in our client's renaissance inspiration. We also chose to include handdrawn elements, to bring a human touch. And finally, the "exit" button, combining the spark and the arch to navigate a user out of a story page. LOGO We explored a myriad of options and iterations before landing on the final logo. Because of our client's keen interest in distinct typography for the brand, we spent time finding the perfect typeface for the brand and a way of featuring typography within the logo. Our client wanted something illustrative and symbolic of the brand, accompanied by an emblem tying in the brand’s key illustrative elements. Through much iteration, we solidified two standard versions of the logo, a logotype and a logomark. WEBSITE DEVELOPMENT We began the web development with low-fidelity wireframes for desktop. After defining final sizing and spacing for all basic elements for each page, we created tablet and mobile breakpoints. Because of the website’s publication nature, we quickly realized that it was necessary for us to develop story pages that were versatile and adjustable to different content. Our story page layout needed to adapt to everything from heavily photographic stories, to stories with up to 20,000 words that had no images. Because of this, we designed story pages into modules that were fully customizable. Due to the brand’s intended unique nature and our client's intrigue with experimental web elements, our team moved to implement a more abstract navigation system. Our team felt strongly that compelling navigation would be the best way to grab user attention site-wide, whilst encouraging users to browse different pages. Unfortunately, many of these were potentially inaccessible to users, and eradicated the possibility for future advertising on the site so we determined that simple navigation, complemented with animation, would be the best way to keep accessibility at the forefront of our design, whilst bringing the site to life. HANDOFF At the end of our project, we handed off a package of deliverables, including logo files, graphic elements, imagery, wireframes, and a Brand Book with guidelines on how to utilize the new visual identity of The Alleyway. If you would like to see the Brand Book, check out the link above.