Student Peace Initiative

Website Concept

The Student Peace Initiative (SPI) has been fostering dialogue, creativity, and community on Loyola’s campus for over a decade. SPI hosts an annual Peace Festival in the Quad, announces the year’s theme for the Spring Peace Conference, and brings together speakers, artists, and students through a call for abstracts. Additionally, SPI publishes a yearly Peace Journal and organizes meetings and community outreach events. Our project focuses on designing a centralized website for SPI to showcase their activities, highlight their impact, and provide a cohesive digital presence for students, faculty, and the broader community.

Peace in one place

Despite its long history and active programming, SPI lacked a centralized online hub to share information, manage submissions, and showcase past work. Details about the Peace Festival, the conference, the call for abstracts, and previous Peace Journals were scattered or difficult to access. This made it challenging for participants and the community to engage with SPI, access resources, and stay informed about upcoming events. The website aims to solve this problem by providing a clear, organized, and engaging platform to bring all of SPI’s work into one accessible space.

Interview insights

We kicked off the SPI website project by brainstorming a comprehensive set of interview questions for our client meeting with the SPI team. Our goal was to gather insights on the site’s visual direction, essential pages, branding, target audience, technical requirements, and minimum viable product (MVP). After generating a broad list of questions, we refined and categorized them to create a structured interview guide. This preparation ensured that our conversation with SPI was focused, thorough, and aligned with the goals of the website, setting a strong foundation for the design process.

Defining SPI's identity

After our client interview, I created a moodboard to guide the look and feel of the SPI website and centralize all design decisions. During this process, I noticed that SPI’s existing logo could be improved for web use, so I designed a refreshed version while keeping the iconic dove imagery. Although the team hadn’t requested that we stick to their original green and purple palette, I explored different shades to create a cohesive and harmonious visual identity for the website. The moodboard became a single reference point for colors, typography, logos, buttons, and overall inspiration, ensuring consistency across the entire design.

Mapping it out

For the SPI website, I created low-fidelity wireframes focusing on layout and structure to accommodate the team’s specific page requests. The goal was to ensure all content and navigation were clear and intuitive. In class, we reviewed the wireframes and received feedback that helped refine the structure before moving on to high-fidelity designs and visual styling.





Designing the path to peace

After refining our low-fidelity wireframes based on class feedback, I developed the final wireframes for the SPI website. These high-fidelity wireframes maintained a clear and organized structure while incorporating all essential pages requested by the team, including the Peace Festival, Peace Conference, Call for Abstracts, Peace Journals, and other events. Attention was given to intuitive navigation, consistent layout patterns, and content hierarchy to ensure users could easily find information and engage with SPI’s programs. These final wireframes served as the foundation for the visual design phase, translating structure into a polished and user-friendly experience.

Create a free website with Framer, the website builder loved by startups, designers and agencies.