As part of my UX Capstone, I collaborated with Industrial Design and Computer Science majors to create a product tailored for creatives. We developed Mudi, a collaborative mood boarding software that leverages multimedia integrations, AI assistance, and curated content—serving as the ultimate resource for creative inspiration.
In collaboration with Carson Porter-Keese, Daniel Jones, and Pax Newman.
My Role
UX/UI Design and User Flow
Competitor Research, User Personas, and UX Strategy
Paper Prototyping and User Testing
01 Background
WHAT NEEDS FIXING?
THE PROBLEM
Mood boarding is an essential process for creatives across many fields because it helps visually convey ideas and align teams on a unified vision. The process can be done through various mediums, and often involves online image searches combined with compiling these images in separate document software. This can become tedious and time-consuming due to the need for extensive searching, selecting, and organizing.
Photography courtesy of Pexels.com
WHERE'S THE VALUE?
OPPORTUNITY
The manual effort required to find and compile suitable images, along with the collaboration it requires when working in a team, can make mood boarding a challenging task. Moreover, mood boarding can extend further than simply image and videos— audio, text, and textures are all things that can be sourced for inspiration. What if there was a way to seamlessly incorporate multiple forms of media into one?
By streamlining the content compilation process, enhancing search capabilities, and consolidating inspiration and design into one interface, mood boarding could be revolutionized into a more efficient and creative task.
SOLUTION
STREAMLINE THE MOOD BOARDING PROCESS THROUGH REAL-TIME COLLABORATION, CURATED CONTENT SEARCH, AND MULTIMEDIA INTEGRATIONS.
02 Solution
COLLABORATION
INVITE COLLABORATORS AND DESIGN TOGETHER
To simplify collaboration in mood boarding, we introduced an option for users to invite others to join their boards. By sharing a link, users can collaborate and design mood boards together in real-time.
AI ASSISTANCE
ASK AI TO GENERATE IMAGES AND MORE
Users can effortlessly create mood boards with Mudi AI, which aids in finding similar images, removing objects from photos, and generating new images directly through AI. This versatile tool extends to other media types like video, sound, colors, and textures.
MULTIMEDIA
ADD IMAGES, AUDIO, VIDEO, TEXTURES, AND COLORS
Inspiration knows no bounds, which is why we aimed to expand mood boarding beyond just images by incorporating various media forms. Keeping all creatives in mind, users can search for anything and Mudi will compile relevant images, videos, sounds, textures, and color palettes to fit their descriptions seamlessly.
AUTO-COMPILE
GENERATE A COLLAGE
Designing collages for your mood board is effortless with Mudi. Users can simply drag and drop media items, then utilize the Auto Grid tool to automatically generate a balanced and stunning collage with just one click.
03 User Flow
ONBOARDING PROCESS
LEARNING HOW TO USE MUDI
To showcase our prototype, I designed an onboarding process that guides users through all of Mudi's features. This user flow sends users through a step-by-step instructed tutorial to designing their first mood board with Mudi.
Click below for the Final Prototype on Figma:
04 Research / Process
COMPETITOR RESEARCH
WHO ARE THE COMPETITORS?
In our competitive analysis of mood boarding platforms such as Pinterest, MilaNote, and Savee, we identified significant gaps in collaborative features, customization capabilities, and multimedia integrations. This highlighted an opportunity for us to innovate by offering a more versatile platform that caters to a broader range of creative needs, incorporating successful aspects from each competitor while enhancing collaboration and customization options.
USER PERSONAS
WHO IS OUR AUDIENCE?
We developed four distinct user personas to embody our primary audience of creatives. Each persona was meticulously crafted to capture diverse perspectives, ensuring our product meets the varied needs and expectations of various creative passions.
USER INTERVIEWS
WHAT DO REAL CREATIVES THINK?
To gather feedback on our mood boarding platform concept from real creatives, we conducted interviews with three professionals: an industrial designer, event planner, and graphic designer. Analyzing their insights helped us identify valuable features to incorporate, aiming to consider their suggestions for revolutionizing the mood boarding and creative process.
PROCESS
INSPIRATION
After addressing the competitors, we ourselves created a mini mood board to inspire the visual style of our product. Our goal was to design a UI with simplicity that would showcase the content users gather, ensuring it enhances the media being displayed.
USER FLOWS
INFORMATION ARCHITECTURE
To define our user flow and determine which features to include, our team created a comprehensive navigation map. This guided us in identifying necessary pages: A standard homepage that includes user's boards and a mood boarding studio which includes all the necessary tools and functions for AI integration, search, and design.
USER TESTING
PAPER PROTOTYPE
To uncover early usability issues and validate design decisions, we created a low-fidelity wireframe and transformed it into a paper prototype. We facilitated classmates through the process, prompting them to interact with affordances on each page that led to new hand-drawn slides. Through this exercise, participants encountered usability issues with several icons and the lack of intuitiveness from our layout.
USER TESTING
LO-FI PROTOTPYE
Following initial usability testing, our priority was to refine the UI for greater intuitiveness and reduced complexity. We iterated redesigned screens based on feedback and underwent a final round of critique before proceeding to develop our final prototype.
Reflection
WHAT I LEARNED
COLLABORATION IS VITAL FOR NEW IDEAS
Being the sole graphic designer on the team initially felt intimidating, especially since it was my first time collaborating with Industrial Design and Computer Science majors. I worried that our thought processes might not align or that my contributions wouldn't be taken seriously. To my surprise, this project made me grow immensely fond of collaborative projects. Working alongside a group from diverse fields brought a stream of innovation and thought-provoking ideas to the table. Each member contributed multiple solutions to the same problem, allowing us to collaboratively identify and implement the most effective strategies.
If this was a real product, we would need to further develop more pages and functionalities. But as a base prototype, I'm proud of our final design output. There are still some errors within the search tools, but with another round of in depth usability tests, we could fine tune these errors for a better streamlined flow. Overall, generating a forward-thinking product was extremely fulfilling and excites me about the future of product design.