Second Wind

Second Wind is a repository of offline apps, designed to provide users with essential tools and information in post-disaster situations. Created in collaboration with Guardian Project, a leader in privacy-focused mobile solutions, Second Wind needed a website to explain, promote, and simplify the understanding of this repository. Additionally, Guardian Project wanted the website design to serve as a modular template that could be reused for future projects, allowing for scalability and consistency in their web presence.

The key challenges were twofold:

1. Designing an intuitive and engaging website that explained the complex concept of an app repository to a diverse user base, many of whom might be unfamiliar with the technology, especially under stressful circumstances like a disaster.
2. Developing a flexible and reusable website template that could easily be adapted for Guardian Project’s future needs, without over-branding the repository or overwhelming users with a heavy emotional tone.

I was responsible for:

• Creating all illustrations for the website, avoiding overly literal or disaster-themed visuals.
• Designing the layout, choosing typography, and establishing color schemes that would evoke calmness and clarity while being adaptable for future use.
• Developing a modular design system that Guardian Project could use across multiple websites, ensuring consistency and scalability.

‍

To begin the design process, I immersed myself in understanding the technology behind Second Wind, particularly focusing on the Android system’s approach to app repositories. This informed the layout decisions and helped shape the user experience to be more familiar for Android users while remaining accessible to others.

Key design considerations included:

• Typography: I selected fonts that are scalable and adaptable across different platforms, ensuring they were neutral enough to avoid over-branding while still offering some personality and approachability.
• Color Palette: The color scheme needed to be light, positive, and non-threatening, aiming to reduce anxiety for users in post-disaster situations. I opted for bright, cheerful colors to create a sense of calm and reassurance without being too somber.
• Illustrations: I steered away from literal, disaster-focused imagery. Instead, I created abstract and helpful visuals that could apply to various use cases, ensuring users felt encouraged rather than overwhelmed.

The design also included a flexible system that incorporated modular components, allowing the website to be replicated for future Guardian Project initiatives. I created guidelines for spacing, typography, and dark/light modes, ensuring the website could adapt to different content types and maintain usability across various scenarios.

The process began with wireframes and concept sketches to explore how the content could be structured in a user-friendly, scalable format. After defining the overall layout, I focused on crafting illustrations using Adobe Illustrator, ensuring that they conveyed the right tone while maintaining flexibility for other use cases. In Figma, I refined the design system, working through typographic hierarchies, color schemes, and spacing rules that could easily translate to other Guardian Project websites.

I also ensured that the design was responsive and worked across multiple devices, particularly focusing on how it would appear on Android, given the platform’s familiarity with repositories of apps. Dark mode variations were created to maintain accessibility and user comfort in low-light scenarios.

Though still awaiting full implementation, the design has received positive feedback from both the client and initial user testers.

• Increased Flexibility: The modular design system allows Guardian Project to reuse the website template for future projects, saving time and ensuring consistent branding.
• User-Centered Design: The thoughtful use of colors, typography, and non-literal illustrations helps create a calming and approachable user experience, reducing stress for users accessing the repository in challenging circumstances.
• Scalability and Consistency: The guidelines for typography, layout, and dark mode ensure the design can easily be adapted to future projects while maintaining the same cohesive look and feel.

This project taught me the importance of designing for flexibility and scalability, especially when working with clients who have evolving needs. By creating a modular system, I helped Guardian Project build a reusable framework for future websites. Additionally, I learned how to balance the emotional tone of a design, ensuring that the visuals were not too heavy for users in distress, while still communicating the gravity of the situation. Lastly, this project reinforced the value of deep user and platform research—in this case, the specific needs of Android users—which shaped many design decisions.

The Second Wind project showcased the power of thoughtful design in challenging contexts. By understanding user needs and balancing flexibility with a clear, approachable design, we created a framework that not only served its immediate purpose but also set the stage for future adaptability. The result was a user-friendly platform that can easily scale for other projects, reinforcing Guardian Project’s mission while ensuring that users in post-disaster situations feel supported and empowered.