MotionLoop
Creative Path
MotionLoop
Creative Path
In a throwaway society, my partner and I became increasingly aware of the environmental impact of waste. This realization inspired us to explore opportunities for adopting a circular economy, with a focus on reuse and recycling. Our focus has been on extending the life of materials and advancing sustainability in areas that are often overlooked. We are committed to finding innovative solutions that challenge conventional practices and foster a more responsible approach to resource management.
In a throwaway society, my partner and I became increasingly aware of the environmental impact of waste. This realization inspired us to explore opportunities for adopting a circular economy, with a focus on reuse and recycling. Our focus has been on extending the life of materials and advancing sustainability in areas that are often overlooked. We are committed to finding innovative solutions that challenge conventional practices and foster a more responsible approach to resource management.
Background
Background
Known worldwide, Vancouver is the third largest Film & TV production centre in North America. The film and television industries process a remarkable amount of material, and for a very long time Metro Vancouver lacked a facility or network to store these used materials and distribute them back within the community.
Known worldwide, Vancouver is the third largest Film & TV production centre in North America. The film and television industries process a remarkable amount of material, and for a very long time Metro Vancouver lacked a facility or network to store these used materials and distribute them back within the community.
3rd
Largest Film & TV
Production Centre
North America, Film L.A
25k+
Largest Film & TV
Production Centre
VEC/Nordicity, 2020
$4.8B
Largest Film & TV
Production Centre
VEC, 2021
Spotlight on Sustainability
Spotlight on Sustainability
In the effort to promote sustainability within the film industry, we recognized a key opportunity to extend the lifespan of textiles, particularly in costume production. Despite the significant volume of materials used in Metro Vancouver's film industry, most are discarded after a single use. MotionLoop Studio addresses this challenge by spearheading a green initiative in costume design, repurposing textiles to reduce waste and foster more sustainable practices.
In the effort to promote sustainability within the film industry, we recognized a key opportunity to extend the lifespan of textiles, particularly in costume production. Despite the significant volume of materials used in Metro Vancouver's film industry, most are discarded after a single use. MotionLoop Studio addresses this challenge by spearheading a green initiative in costume design, repurposing textiles to reduce waste and foster more sustainable practices.
What We Discovered
What We Discovered
Our investigation into sustainability in BC's film industry revealed key initiatives like Reel Green at Creative BC, which promotes environmental collaboration, and Keep It Green Recycling Ltd., which prioritizes recycling and waste diversion. Interviews with designers like Tessa and Chris underscore a growing shift toward eco-conscious practices in costume and set design, highlighting the importance of reusing materials and adopting greener production methods.
Our investigation into sustainability in BC's film industry revealed key initiatives like Reel Green at Creative BC, which promotes environmental collaboration, and Keep It Green Recycling Ltd., which prioritizes recycling and waste diversion. Interviews with designers like Tessa and Chris underscore a growing shift toward eco-conscious practices in costume and set design, highlighting the importance of reusing materials and adopting greener production methods.
Research Findings
Research Findings
We conducted design research by collecting user feedback on textile reuse and sustainability, then analyzed this data to identify key patterns. We created personas to ensure our design solutions effectively meet the needs of sustainability advocates and film industry professionals.
We conducted design research by collecting user feedback on textile reuse and sustainability, then analyzed this data to identify key patterns. We created personas to ensure our design solutions effectively meet the needs of sustainability advocates and film industry professionals.
Persona Development
Persona Development
Understanding our audience's goals and challenges helped us focus MotionLoop Studio's services on the needs of sustainability advocates and film industry professionals.
Understanding our audience's goals and challenges helped us focus MotionLoop Studio's services on the needs of sustainability advocates and film industry professionals.
Insight
Insight
We conducted design research by collecting user feedback on textile reuse and sustainability, then analyzed this data to identify key patterns. We created personas to ensure our design solutions effectively meet the needs of sustainability advocates and film industry professionals.
We conducted design research by collecting user feedback on textile reuse and sustainability, then analyzed this data to identify key patterns. We created personas to ensure our design solutions effectively meet the needs of sustainability advocates and film industry professionals.
Card Sorting
Card Sorting
Activity:
Open card sort, participants sort cards into categories that make sense to them, and label each category themselves
The Goal:
To understand how users think about the content on the service website. It can help us organize content so that it suits the user’s mental models.
Three participants: 2 in-person, 1 online
.
Activity:
Open card sort, participants sort cards into categories that make sense to them, and label each category themselves
The Goal:
To understand how users think about the content on the service website. It can help us organize content so that it suits the user’s mental models.
Three participants: 2 in-person, 1 online
Affinity map
Affinity map
The main findings highlight a need for greater clarity around certain features, such as "feature collections" and "design your own service," and suggest adding more context and imagery for better user understanding. There’s also a preference for more graphical elements like images and videos, and additional footer information beyond just the copyright. Considerations include maintaining customer relationships, rental duration and extension options, and potential benefits for repeat or loyal customers.
Main Findings:
• Some features are unclear; it is preferable to provide more context and imagery(what are feature collections? What exactly is "design your own service?")
• Consider having more information in the footer rather than just the copyright
•Prefer more graphical elements (image and videos)
Considerations:
•How does the service maintain relationships with its customer?
• How long can you rent an item for? Can you extend the rent time?
• What is the benefit for repeated/loyal customer?
The Build
The Build
When conceptualizing foundational frameworks for the MotionLoop campaign, we placed a high importance on design principles including clarity, consistency, and end-user focus. The layout underscored easy-to-understand navigation, ensuring the size guide was readily available. We also explored responsive design in order to optimize approachable interfaces on an array of devices, guaranteeing seamless access to booking forms and filtering options. Through the regimented use of visual structure and balance, our goal was to guide users efficiently and enhance engagement with features such as term-of-rent notifications.
When conceptualizing foundational frameworks for the MotionLoop campaign, we placed a high importance on design principles including clarity, consistency, and end-user focus. The layout underscored easy-to-understand navigation, ensuring the size guide was readily available. We also explored responsive design in order to optimize approachable interfaces on an array of devices, guaranteeing seamless access to booking forms and filtering options. Through the regimented use of visual structure and balance, our goal was to guide users efficiently and enhance engagement with features such as term-of-rent notifications.
How did users respond?
How did users respond?
Main Findings:
• Missing measurement chart (how does sizing work for costumes?)
• Search Engine Optimization (How should items be labelled for easy retrieval by employees and customers? What are some possible filters?)
• Appointment forms (Customers should fill out a form and write down the size, colour, and details for the designer to understand ahead of time.
• Missing measurement chart (how does sizing work for costumes?)
• Search Engine Optimization (How should items be labelled for easy retrieval by employees and customers? What are some possible filters?)
• Appointment forms (Customers should fill out a form and write down the size, colour, and details for the designer to understand ahead of time.
Considerations:
• There can be reminders sent out to customer before their rent deadline
• Have a truck service available for customers who live further away from the location (bringing costumers over rather than customer coming in-person)
• There can be reminders sent out to customer before their rent deadline
• Have a truck service available for customers who live further away from the location (bringing costumers over rather than customer coming in-person)
Further Discovery
Further Discovery
Activity:
To prepare for the next usability testing, we created a medium fidelity prototype that connected the user flow of the main pages on the website, including different filter engine and layout
The Goal:
To identify if the website is intuitive to understand and if the layout resonates positively to the user needs.
Activity:
To prepare for the next usability testing, we created a medium fidelity prototype that connected the user flow of the main pages on the website, including different filter engine and layout
The Goal:
To identify if the website is intuitive to understand and if the layout resonates positively to the user needs.
What feedback came from the second round?
What feedback came from the second round?
Main Findings:
• The search bar is too big on the homepage, could replace it with an icon and have a gallery on top of the page to show main features instead
• Avoid jargon and fancy terms (could consider more terms relevant to the industry)
• Emphasize book appointment feature “Why should I use this service? How does it work?
• Drop down menu is confusing (there are repeated sections on different pages)
• The search bar is too big on the homepage, could replace it with an icon and have a gallery on top of the page to show main features instead
• Avoid jargon and fancy terms (could consider more terms relevant to the industry)
• Emphasize book appointment feature “Why should I use this service? How does it work?
• Drop down menu is confusing (there are repeated sections on different page.
Considerations:
• How to convey the service as a long term rental model?
• What kind of product images are going to be used? (Mannequin, laid flat, etc.)
• How to convey the service as a long term rental model?
• What kind of product images are going to be used? (Mannequin, laid flat, etc.)
Responsive Design Screens
Responsive Design Screens
As part of our design process, we prioritized showcasing responsive design to ensure an optimal user experience across all devices. This included solving challenges around resizing images and text for different screen sizes. By using fluid grids, adjusting image ratios, and scaling fonts, we maintained clarity and functionality.
Our goal was to create a seamless, accessible platform for users, making it easy to browse, book, and interact with content regardless of the device they’re using.
As part of our design process, we prioritized showcasing responsive design to ensure an optimal user experience across all devices. This included solving challenges around resizing images and text for different screen sizes. By using fluid grids, adjusting image ratios, and scaling fonts, we maintained clarity and functionality.
Our goal was to create a seamless, accessible platform for users, making it easy to browse, book, and interact with content regardless of the device they’re using.
Information Architecture
Information Architecture
We went through multiple iterations of the information architecture before finalizing the structure. Initially, we sketched out different layouts to explore how content would be grouped and accessed.
Through testing and feedback, we refined the navigation, improving the flow and hierarchy. We adjusted labels, reorganized sections, and optimized the search function to make retrieval easier for users. Each version was tested and evaluated, ensuring that the final design provided a clear, intuitive experience that aligned with user needs.
We went through multiple iterations of the information architecture before finalizing the structure. Initially, we sketched out different layouts to explore how content would be grouped and accessed.
Through testing and feedback, we refined the navigation, improving the flow and hierarchy. We adjusted labels, reorganized sections, and optimized the search function to make retrieval easier for users. Each version was tested and evaluated, ensuring that the final design provided a clear, intuitive experience that aligned with user needs.
UI Design
UI Design
In designing the UI for MotionLoop, we opted for a friendly color scheme and clear, readable typography. These choices ensured accessibility, improved user experience, and maintained brand consistency across various devices.
In designing the UI for MotionLoop, we opted for a friendly color scheme and clear, readable typography. These choices ensured accessibility, improved user experience, and maintained brand consistency across various devices.
Style Guide
Style Guide
The style guide for MotionLoop incorporates Poppins as the main font, valued for its clarity and modern appeal. The color palette is centered around orange, representing creativity and vitality; black, providing depth and elegance; and white, ensuring a clean and straightforward aesthetic. This thoughtful combination fosters a cohesive visual identity that enhances user experience and embodies MotionLoop’s dedication to sustainability and innovation.
The style guide for MotionLoop incorporates Poppins as the main font, valued for its clarity and modern appeal. The color palette is centered around orange, representing creativity and vitality; black, providing depth and elegance; and white, ensuring a clean and straightforward aesthetic. This thoughtful combination fosters a cohesive visual identity that enhances user experience and embodies MotionLoop’s dedication to sustainability and innovation.
Branding Logo
Branding Logo
The design was crafted to embody a circular economy, emphasizing the idea of continuous material reuse. This concept highlights our commitment to sustainability, illustrating how resources can be repurposed and reintegrated into the production process, ultimately reducing waste and fostering an eco-friendly approach within the film industry.
The design was crafted to embody a circular economy, emphasizing the idea of continuous material reuse. This concept highlights our commitment to sustainability, illustrating how resources can be repurposed and reintegrated into the production process, ultimately reducing waste and fostering an eco-friendly approach within the film industry.
Interior Space
Interior Space
The interior space for MotionLoop Studio was designed with Foyr, featuring detailed floor plans, 3D renders, and 360-degree walkthroughs. Key touchpoints, like textile drop-off areas and customer interaction zones, were integrated to support the sustainability mission while seamlessly connecting the digital and physical experiences.
The interior space for MotionLoop Studio was designed with Foyr, featuring detailed floor plans, 3D renders, and 360-degree walkthroughs. Key touchpoints, like textile drop-off areas and customer interaction zones, were integrated to support the sustainability mission while seamlessly connecting the digital and physical experiences.
Final Deliverable
Final Deliverable
Following a three-month period of adjustments and enhancements, we completed our labors on MotionLoop, concluding with a sequence of detailed wireframes and brief video sequences of users engaging with the mock-up. These imagery enliven the platform, demonstrating its operation while emphasizing the transition from idea to sophisticated design.
Sherry and I were extremely pleased with the final product, which meticulously aligns with MotionLoop’s aim to simplify and democratize sustainability. This undertaking solidly represents our mutual objective and the considerate, user-focused strategy we implemented throughout the design journey.
Following a three-month period of adjustments and enhancements, we completed our labors on MotionLoop, concluding with a sequence of detailed wireframes and brief video sequences of users engaging with the mock-up. These imagery enliven the platform, demonstrating its operation while emphasizing the transition from idea to sophisticated design.
Sherry and I were extremely pleased with the final product, which meticulously aligns with MotionLoop’s aim to simplify and democratize sustainability. This undertaking solidly represents our mutual objective and the considerate, user-focused strategy we implemented throughout the design journey.
