Prototype link: Prototype link (Please submit a link to a playable prototype, not a link to your design file) (https://vine-liver-39823962.figma.site) A link to your team’s prototype, whether that’s Framer, Figma or another design tool. The playable prototype must include at least 6 hi-fidelity screens.

Describe your project (Max 150 words) Our project is a website, showcasing the Maslow's Hierarchy of Needs. We wanted to bridge the gap between generations based on human experiences through a website showcasing how these needs may change over each generation, and showcasing common stories between the 4 generations the link each of the needs. Ultimately, this brings people closer together as we realize we all have common experiences. We also included a space to start conversations for a more free following discussion as to not stifle insightful dialogue.

Describe your research process and findings. If you conducted any surveys or interviews, please include the survey form and/or interview questions here. If you conducted secondary research by pulling from online sources, please include a link to your sources. (Max 500 words)

For our research process, we interviewed a sample group from each generation from across the nation and globe. We generated questions that would further illustrate how Maslow's hierarchy of needs looked different for each generation. Here are a few of the interview questions we asked:

  • Did you feel a sense of belonging was important for your future?
  • What does success look like to you? (Provide them with a few options like money, stable job, financial stability, a family etc to see which one they picked.
  • In terms of your position in the world, how would you describe it?
  • Describe some elements of safety to us; what makes you feel safe?
  • Say you believed in the concept of rebirth, what would make you satisfied enough to leave this life and enter the next in terms of self-actualization

Describe your most important design decisions. What research findings and/or user testing results led you to make these decisions? (Max 500 words)

Maslow's hierarchy of needs have changed over time so there’s a disconnect between older and younger generation due to the misalignment of different needs and what they mean. When interviewing, we saw that each generation had common stories that link each of their needs together. Each story served a different function for each need but that commanility helps other people understand another point of view. Our important findings stated that generations felt disconnected at the heart but not the root, suggesting common experiences existed; they just each had different perspectives stemming from the world they grew up in and the major events around that time. These findings lead to us intentionally designing the website to feel closer together but still minimal at the same time. Our design firstly reflected the pyramid of needs through a scroll based experience that takes you from the top to the bottom. Most screens have a design of based on 4 quadrants to reflect the 4 generations but also it has a natural element to it. We see groups of 4 in nature all the time: four elements (earth, air, fire, water), four seasons, four cardinal directions. Nature is a common concept we all share, and relating this to bridging the gap, we wanted our design to feel as inclusive for each generation.

We also created a section to explore each tier and what this means to each generation like safety. This helps us integrate meaning into the pyramid instead of it being just a visual element. It gives it life, and thats what we wanted this project to feel like. Throughout the entire website, we kept a consistent color scheme and had small touches of those colors floating around to give a calm atmosphere because sometimes discussing uncertainty can make one anxious.

If applicable, describe how you utilized AI in your design process in detail. Please explain where AI fit into your workflow, which tools you used, and the specific purpose AI served at that stage. Include a concrete example of how AI influenced a design decision. (Max 500 words)

We were having some problems with the background of the website being glitchy so we used ChatGPT to fix the glitching effect. It rewrote some of the code so the website would look more visually appealing, and generate a better user experience, one that made them feel comfortable.

Built With

  • figma
Share this project:

Updates