Categories
Case study

Speeding up production using a web app

Case Study

Kekuli Bay Cabinetry | Parts Tracker App

Web App Development | Cross-Platform | Information Management

The Parts Tracker App drastically reduces lost parts and saves 1000+ production hours each year.

We developed the Parts Tracker App, a responsive web application that actively updates and tracks the location of parts inside a manufacturing factory.

Problem

Growth in a manufacturing business comes with logistical challenges. When there are thousands of moving parts, excessive overhead hours are spent on tracking their movement from location to location. What if we create a web app that shows where parts are located at all times?

Kekuli Bay Cabinetry, one of the largest Canadian cabinet manufacturers in British Columbia, needed a digital solution for managing the information of cabinetry parts. There are many off-the-shelf technologies available in the market to support this need. However, these systems are often bloated with unnecessary features, and are not a cost-effective solution in the long term.

Solution

The Parts Tracker App is a responsive, user-friendly web application that efficiently tracks the location of parts inside a factory at all times:

  • QR code scanning to update the locations of parts
  • Search, view, and export information of parts
  • User accounts and login
  • Custom admin panel for creating, managing, and viewing parts
  • Mobile, tablet, and desktop compatibility

Process

Embracing User-Centered Design

With any project at Raccoopack Media, we begin by understanding the needs of the users and their objectives. To accomplish this, we interviewed managers and employees at Kekuli Bay Cabinetry, taking time to map out their day-to-day business processes. This allowed us to clarify the detailed app requirements, such as the types of information that need to be tracked, steps involved in scanning parts, and core features of the app.

Simplicity, efficiency, and intuitiveness were identified as the design pillars of the app. Following these pillars, we created a minimalistic yet highly functional design, which allows the user experience to be focused on the input and reading of information.

Optimizing the User Experience

During the development of the app, we conducted remote user testing sessions with a group of 10 employees to understand whether the app meets the criteria of being easy to use. We observed how users would interact with the app, noting down opportunities to enhance the user experience. By ensuring that the app is intuitive and easy to use, we generate further cost savings for our client, namely from time saved in training and troubleshooting.

After conducting user testing, we analyzed the resulting testing data, and gained valuable insights on how to take the intuitiveness factor one level higher. For example, we discovered that employees needed more time to view pop-up messages, and we fine-tuned the durations accordingly.

Results

By following a high level standard of user-centered design, we were able to deliver a seamless and smooth part scanning experience across mobile and tablet devices. Employees can easily scan and update the location of parts, while managers can quickly retrieve and locate the parts with a click of a button.

The Parts Tracker application will provide cascading advantages for Kekuli Bay Cabinetry: Time saved, cost savings in parts, and faster fulfillment time of customer orders.

What about the value expressed in numbers? In just the first year of use, here are the expected benefits for Kekuli Bay Cabinetry:

0 +
Management hours saved
$ 0 +
Saved by reducing lost parts
0 %
User testers rated very easy to use
0 +
Management hours saved
$ 0 +
Saved by reducing lost parts
0 %
User testers rated very easy to use
0 +
Management hours saved
$ 0 +
Saved by reducing lost parts
0 %
User testers rated very easy to use
“What stands out about their team is their great attention to detail and commitment to delivering precise solutions. Let them take the lead because they’re experts at what they do. You only need to trust Raccoopack Media to make great things happen for your business.”
Matt McLellan
Factory Service Manager
Kekuli Bay Cabinetry

Have an idea you want to see come to life?

rpmlogo
Categories
Case study

Teaching bracelet weaving on a tablet app

Case Study

SpiceBox | i-loom Companion App

Education | Tablet | iOS and Android

Weaving intricate bracelets can be complex – Let’s reduce the learning curve with guided tutorials on an interactive tablet app.

We worked with Spicebox Product Development to bring an outdated app up to speed with modern tablet devices, resolving hundreds of bugs and issues in the process.

Problem

The i-loom app provides guided tutorials on weaving bracelets on tablets, and is complimentary with the purchase of the physical loom. In the past, this app was praised with a highly positive reception. However, as years passed, user ratings declined due to issues with bugs and incompatibility with newer devices.

Spicebox recently acquired this product, and wanted to improve the app’s user experience prior to a product relaunch. As Raccoopack Media is experienced with app development for education and training, Spicebox reached out to us to revitalize i-loom app.

Solution

The goal of the project is to update and optimize the i-loom app for iOS and Android devices, including a relaunch to the App Store and Play Store. After we mapped out the problem space, the next step was to identify and prioritize the issues that were essential for a successful launch.

From our analysis, we created a list of the most important issues to address:

  • Migrating the project from Unity 5 to Unity 2018
  • Updating Unity asset packs to resolve compatibility issues
  • Repairing a freezing iOS tutorial
  • Updating the Android QR code scanner 
  • Fixing launch critical bugs

Process

Collaborative Problem-Solving

At the beginning of the project, an obstacle our team had encountered was a lack of access to a working version of the app. This resulted in guesswork on how some features had performed, which involved many uncertainties.

Fortunately, our agile processes enabled us to address this challenge by using frequent client communication. By brainstorming with Spicebox, we quickly discovered that the previous developer had some past footage of the app. We coordinated with Spicebox to secure the necessary information throughout the project, which paved the path for our team to recreate and repair the app’s most important features.

Profile: Before vs After Rework

Colour Palette: Before vs After Rework

Results

From our consistent efforts, we were able to successfully bring the i-loom app into modern times. The app, once plagued with bugs and compatibility issues, is now able to run smoothly on iOS and Android tablet devices:

  • Launch-ready state for App Store and Play Store
  • Upgraded app project to Unity 2018
  • 1000+ broken references resolved
  • 100+ missing scripts repaired

As we are continuing to work with SpiceBox post-launch to develop more exciting features to the i-loom app, stay tuned for more updates on this case study! 

Have an idea you want to see come to life?

rpmlogo
Categories
Case study

Supporting a virtual industry conference using a web app

Case Study

HHBanner

SafeCare BC | Hearts & Hands 2020

Virtual Event | Gamification | Web App

During the COVID-19 pandemic, we helped make a lively, large scale event happen – virtually.

The annual Hearts & Hands event is a premier conference to celebrate the efforts of healthcare assistants. SafeCare BC was pleased with their prior experience in working with us, and reached out to us to develop an app for them once more.

Problem

To ensure the health and safety of event participants during the COVID-19 pandemic, SafeCare BC decided to take the Hearts & Hands event digital. The goals of the project included these business considerations:

  • Engagement: Although the event was going virtual, it should continue to be a quality and relevant experience for the participants. The event will need to recreate major parts of the event, such as presentations and education sessions.
  • Timeliness: The project needed to be completed quickly, as the event date was scheduled in a few months.
  • Accessibility: Participants need to be able to access the event on all device platforms at any given time.

Solution

Going virtual didn’t mean creating a lesser event experience: A virtual event opened up new ways to involve participants during the event. In fact, participants expressed their excitement over the interactive format of the event this year.

To meet the goals of the Hearts & Hands 2020 event, we developed a web-based event app to deliver a content rich and user-friendly experience. On top of the features that supported the main aspects of the event, we designed gamification features that allow participants to earn points as they engage in each activity.

Main features we created inside the app include:

  • Multiple event activities: Activities include watching presentations, participating in learning activities, browsing sponsor spotlights, and viewing prizes.
  • Point system: Participants earn points as they participate in activities to enter into a raffle draw.
  • Cross-platform compatibility: Anyone can join using their desktop computers, tablets, and mobile phones.

Process

Creating a Seamless User Experience

The first phase of development involved creating a user persona to understand the goals of the users in the Hearts & Hands event. As we dived deeper into the user journey, we designed a user flow to ensure a seamless user experience. 

During the prototyping process, we performed user testing virtually with healthcare assistants and educators to get their feedback. This helped us make improvements in accessibility and the overall user experience.

Increasing Engagement Using Gamification

The point system was a central driver of engagement in the event. We designed a point system which awarded participants points for completing different activities, such as watching presentations, interacting with learning content, and completing trivia quizzes. 

Given that SafeCare BC was able to secure fabulous raffle prizes, it was especially enticing for participants to earn as many points as possible. This encouraged participants to complete every activity of each day of the multi-day event, and come back the next day for new content. Each day, participants were notified of newly unlocked content by a SMS message.

Results

The finished product was a beautiful, polished app that led to the successful execution of the Hearts & Hands 2020 event. Over 700 healthcare assistants, industry professionals, and business executives from across British Columbia registered for the event.

The results are proven by the overwhelmingly positive reception to the web app. Here is what the participants had to say about the event:

  • “All sessions were excellent. I hope you consider having the same platform next year as this year.”
  • “I like the points system as rewards.”
  • “The site was very easy to navigate. I’m happy it was made accessible online as we all couldn’t meet in person this year.”

Have an idea you want to see come to life?

rpmlogo
Categories
Case study

Gamification for dementia care training

Case Study

VCH Header

Vancouver Coastal Health | The ART & SCIENCE of Person-Centered Care Game

Gamification | Education and eLearning | Healthcare

The game was initially tested with over 70 interdisciplinary staff at Vancouver General Hospital. Now, it has been used by over 2000 people across 10 hospitals. This is an award winning research, funded by Michael Smith Foundation for Health Research.

George Padua, Raccoopack Media’s founder and experienced game developer, worked with Vancouver Coastal Health to develop a web game that educates staff across health authorities on the topic of dementia care.

Problem

Dr. Lillian Hung, clinical nurse specialist at Vancouver General Hospital, recognized the potential of gamification in education as she applied gamification principles to her PhD work. Gamification does not only offer an interactive experience, but can also include social elements to motivate learning. This inspired her to help staff learn about dementia care through a game that is engaging, fun, and connected.

“The ART & SCIENCE of Patient-Centered Care is all about attitude and practice, which require a shift in the norm of social interactions. Gamification seems to be effective to help with the shift.” – Dr. Lillian Hung

Solution

Given George’s experiences with game design, he crafted a game to meet the learning outcomes of “The ART & SCIENCE of Person-Centered Care”. The game is carefully designed to be fun and simple to play while serving the purpose of educating staff.

Learning by Playing

The player begins by choosing an avatar to represent them, and is then presented with scenarios to learn the acronyms behind the “ART” and “SCIENCE” in caring for patients with dementia. These scenarios represent real-life situations that many staff encounter. To earn as many points as possible, the player must choose the appropriate strategy before the timer runs out.

Creating a Friendly Competition

On top of the scenario-based training, George also implemented a leaderboard system that shows the top scores categorized by hospital, unit, and individuals. A leaderboard offers a number of advantages in gamification by creating a friendly competition. Players are motivated to play the game multiple times and earn the most points possible. This allows the player to learn through repetition and practice, aiding in gradual retention of the learning content.

Process

User-Centric Development

As the intended players of the game include a wide range of healthcare professionals, an interesting challenge was ensuring that the content is relatable for everyone. The solution for this was to involve the target players during the development process. This included working with nurses, physicians, and care aides to both develop the content for the game. As well, prototypes were tested with these user groups to gather their experiences and feedback, which provided insights on how to improve the game design.

Results

The game was tested with over 70 interdisciplinary staff before arriving at the final product. Since the completion of the project, the game has been used in staff orientation for Vancouver General Hospital staff and has been introduced across 10 hospitals in British Columbia.

This widespread adoption goes to show the effectiveness of leveraging gamification in a professional education setting. Vancouver Coastal Health conducted a survey on the staff who played the game, and the findings are compelling:

“In the evaluation, 93% found the games helped them learn and understand person-centered care. 90% agreed that they learned practical knowledge of dementia care and they would recommend the game to others.”
VCH-logo
Vancouver Coastal Health

Have an idea you want to see come to life?

rpmlogo
Categories
Case study

Interactive web game to educate youth on invasive species

Case Study

invadercrusaders

Invasive Species Council Of BC | Invader Crusaders

Gamification | Education and Learning | Web Game Development

Invasive species can spread quickly and cause harm to native species, in some cases resulting in the eradication of entire native species.

The impact of invasive species can be difficult to illustrate. What if you can experience this firsthand as you play a game? We developed Invader Crusaders for ISCBC, an intuitive and educational web-based game.

Invasive Species Council of BC (ISCBC) is a non-profit society and registered charity pursuing a vision of healthy landscapes and communities free of invasive species.

Problem

As part of ISCBC’s educational and outreach efforts, ISCBC saw an opportunity to engage youth to learn about invasive species in a fun and interactive manner. They needed a development partner experienced in gamification and app development to take on this project. Given our portfolio in working with non-profit clients, ISCBC saw us to be the right fit.

iscbc-ipad

We first started with a consultation meeting, which helped us identify the key goals of the project:

  • Create a simple, educational game that is visually appealing
  • Educate youth on invasive species and what can be done to reduce their spread
  • Launch the game for desktop and tablets devices

Solution

With a team of talented game designers, UI/UX designers, and developers, we brought the game idea of Invader Crusaders to life.

Stop the invasive species from spreading before it’s too late! Invader Crusaders is a simple, educational point-and-click game where you choose the best action to prevent the spread of invasive species before they get out of control!

How to Play!

  • Win by having more native species than invasive species on the map
  • Faced with a scenario, pick the responsible option to prevent species from spreading
  • Strategically remove invasive species that impact native species

Learning Outcomes

  • Understand what invasive and native species are
  • Identify human behaviours that cause invasive species to spread
  • Take actions that prevent invasive species from spreading

Features

  • Simple, turn-based gameplay
  • Animated species and background
  • 60 pieces of custom scenario art
  • 10 levels to play
  • Desktop and tablet support

Process

Making Learning Fun

We first started by experimenting with different game designs. Initially, we designed the game with a core mechanic of identifying the type of invasive species.

However, to better meet the learning outcomes, we built upon this by focusing on a simple message behind the game that is memorable for the players: Invasive species can spread and cause harm to native species. To this end, players will focus on the goal of minimizing the spread of invasive species.

We learned a lot about invasive species throughout this project — as ISCBC are the experts in this subject matter, we worked closely with them to develop game events that are both relevant and interesting.

Frequent Communication and Feedback

One of the main success factors of the project lies in the communication that was maintained throughout the project between our team and ISCBC. To adapt to the situation of COVID-19, we met digitally online to provide ISCBC with updates to the project. We demonstrated mockups and prototypes early on, which allowed us to make UI and game design improvements while solidifying the vision of the game.

For example, we identified early on that the game should incorporate some of ISCBC’s core programs. From there, we organized the game’s levels to teach these programs incrementally.

Creating a Tutorial

As we conducted user tests with the target audience, there was one common learning. We discovered that the game would benefit from a quick tutorial level that teaches the player how to play. The player is aided by a series of popups that introduces each element of the game as they move along in the level. Not only are they able to learn from the tutorial level, but we also implemented it as a tooltip that can be easily accessed outside of the tutorial level.

Results

Our efforts proved to be fruitful in realizing the vision of the project: We produced a beautiful, polished web game that is not only attractive and entertaining to play, but also serves to educate youth on invasive species.

The evidence? We listened to the feedback of our players. As we conducted further user testing with the game’s intended players, we received consistent positive feedback that the game had taught them something new about invasive species.

As players tackle the different levels, they quickly grasp the effective strategies when encountering invasive species that will help them win the level. That translates to knowledge that can be similarly applied in real world applications. The effectiveness of gamification is reflected in this project.

“The game successfully represents the values of the organization and also serves to further educate younger generations about invasive species. Raccoopack Media leverages their creativity and expertise to produce quality results.”
iscbclogo
Serena Bonneville
Program Coordinator
Invasive Species Council of BC

Have an idea you want to see come to life?

rpmlogo
Categories
Case study

Porting a mobile learning app from iOS to Android

Case Study

ovilleidea

International Digital Education Access | The Learning World of Oville

Android App Development

Oville World provides a safe, imaginative world to discover that sparks creativity, inclusion and kindness while preparing for kindergarten.

I.D.E.A., the organization supporting Oville World, is passionate about creating safe, age appropriate ethical products to teach children at home.

Problem

I.D.E.A. wanted to expand Oville World to support Android devices. The mobile learning app had already been developed for iOS, but they needed an experienced developer to work alongside their team to complete this project within a short timeframe. From there, I.D.E.A. reached out to our team to collaborate on developing the Android version of Oville World.

device

From iOS to Android

Along with developing the game for Android, the central challenge that our team was tasked with is to integrate the existing product’s membership capability from iOS to Android. This feature supports paid subscriptions to access extended content inside the app.

The issue resided in the different requirements for how subscriptions are handled between iOS and Android platforms. We identified the need to find a solution that will maintain cost-effectiveness, followed by a strong compatibility with the existing product.

Solution

As our development team is experienced in both iOS and Android, we were able to quickly understand the technical requirements and specifications for integrating the membership capability.

We began by researching the different platforms for third-party subscription management services. To name a few alternatives, we explored the pros and cons of using Firebase and Amazon Web Services. This led to a solution of adopting Google Cloud due to its cost effectiveness and compatibility with the Google Play storefront. In addition, this service fits the existing infrastructure built on iOS.

As a result, we were able to optimize loading speeds and the size of the game without introducing technical dependencies.

google cloud

Process

Converting to Android

Prior to integrating the membership capability, we first began by converting the mobile game from iOS to Android. This also involved tackling a number of platform specific issues. We upgraded a number of third-party plugins to be compatible with the latest version of Android and to fulfill Google Play store requirements.

The second phase of the project was testing. We completed quality assurance by testing the game on different android devices with differing specifications. This revealed a number of areas which required further optimization, ensuring that the game worked smoothly for the end user.

Open Communication

We worked closely with I.D.E.A. due to our offices being located in close proximity. We held frequent in-person meetings and communicated through online messaging at other times. This allowed for quick turnarounds and sharing of ideas.

Results

We successfully developed the Android version of The Learning World of Oville from start to finish, and launched the game on Google Play to meet the project goals. The project was completed on time and within the client’s provided budget. This was the beginning of a long term relationship with I.D.E.A. as we are continuing to provide ongoing support for this project.

“We were most impressed by our developer’s ability to integrate the subscription service. The process was extremely complex, but he figured out a plan and built the entire system within a very reasonable amount of time. We were blown away.”
idealogo
Nathan Cole
Studio Director
International Digital Education Access

Have an idea you want to see come to life?

rpmlogo
Categories
Case study

Custom web app for technology teachers

Case Study

isabclogo_square

ISABC | Digital Skills Curriculum Builder

Custom App Development | Web Development

To create a modern and balanced curriculum that teaches digital literacy to students, ISABC draws from a wide number of frameworks.

We developed the digital skills curriculum builder with ISABC to offer a visual and user-friendly tool for building curriculums. This online tool is used by curriculum planners and technology teachers.

The Independent Schools Association of British Columbia (ISABC) is an association of 26 outstanding schools, and links teachers and leaders to promote the sharing of the best educational and leadership practices and ideas.

Problem

ISABC was previously using an existing spreadsheet that displayed and linked large datasets from a number of educational frameworks. However, there were a few limitations with this tool:

  • The spreadsheet contains many complex datasets, and is difficult to sort and filter.
  • Users need to easily visualize the relationships between different frameworks, including competencies and support modules.
  • The resulting curriculum needs to be exported to a printable format.

Solution

After understanding the user needs and documenting use cases from interviewing stakeholders with ISABC, we identified visualization, intuitiveness, and accessibility as the core design pillars of the app.

A New and Improved Approach

The Digital Skills Curriculum Builder allows curriculum planner and teachers to easily begin by starting with a skill type, then dive deeper with supporting modules and competencies from different educational frameworks, and vice versa. Supporting information such as grade levels are also displayed in a clear and elegant manner.

Key App Features

  • Mindmap: To provide a high level visualization and entry point of the curriculum
  • Curriculum builder: Assists the development of education frameworks by enabling the filtering and connection of digital skill types
  • Export: Create an offline and printable curriculum

Process

Focusing on the User Experience

As one main goal of the project is to make the curriculum builder easy to use while linking the various datasets together, the key is to create an effective user flow. To accomplish this, we gathered feedback from the users on the as-is spreadsheet tool to understand the steps taken to produce a curriculum. Using this information, we were able to link the datasets into a user flow that provides a methodical step-by-step approach of creating curriculum on the builder.

As well, this information allowed us to detail user stories and wireframes for the mind map, curriculum builder, and export features.

Results

After a series of iterations and testing, Raccoopack Media was able to deliver the project on time and budget. The release of the interactive Digital Builder has had a transformative impact for educators and teachers. On top of time and effort saved, the tool provides the advantage of visualizing the links between the different educational frameworks.

Have an idea you want to see come to life?

rpmlogo
Categories
Case study

Improving mental health education with a mobile app

Case Study

Bear In Mind Header

SafeCare BC | Bear In Mind

Education & Training | Gamification | App Development

Continuing care workers often face stressful situations.
How do we help them manage stress and promote mental wellness?

We created Bear In Mind for SafeCare BC, an industry funded, non-profit association working to ensure injury free, safe working conditions for continuing care workers in BC.

Problem

SafeCare BC recognizes the importance of psychological health, resilience, and stress management in the continuing sector. As part of their initiative to continuously increase the effectiveness of training, they have the following needs to consider:

  • Engagement. The training needs to be delivered in an interactive and modern format.
  • Accessibility. Many continuing care workers cannot access in-person training, due to various reasons.
  • Relevance. The audience should find the learning personalized and easy to start.
Based on our team’s past experience with developing a gamified staff training module for Vancouver Coastal Health, SafeCare BC found our team to be the right fit and tasked us tackle this challenge.

Solution

After several brainstorming sessions with SafeCare BC, we arrived at the idea of developing the educational mobile game Bear In Mind. This app teaches mental health techniques to continuing care workers in order to become more resilient during unexpected situations.

How to Play

Learners guide their continuing care bear worker to navigate day-to-day challenges at work and in their personal life. 

The gameplay is simple and intuitive – learners are presented with various dialogues depicting difficult situations. In each dialogue, learners choose a response to the situation, and the outcome of their choices are played out in the dialogue.

Interactive, Hands-On Learning

As each dialogue is completed, appropriate stress management techniques are showcased to teach the concept. The learner is awarded more points for making better decisions that promote their psychological well-being and resilience.

How to Play

Learners guide their continuing care bear worker to navigate day-to-day challenges at work and in their personal life. 

The gameplay is simple and intuitive – learners are presented with various dialogues depicting difficult situations. In each dialogue, learners choose a response to the situation, and the outcome of their choices are played out in the dialogue.

Interactive, Hands-on Learning

As each dialogue is completed, appropriate stress management techniques are showcased to teach the concept. The learner is awarded more points for making better decisions that promote their psychological well-being and resilience.

Key App Features

  • Scenario based learning game
  • Hands-on engagement through choices
  • Presentation of stress management techniques
  • Customizable bear appearance
  • Online leaderboard

Process

Designing a Learning Game

In order to craft a game that produces the intended learning results, we needed to gather detailed research on mental health. We worked closely with SafeCare BC to conduct field research with continuing care workers to gather common stressors and the ways they cope with them.

On top of that, we interviewed experts in mental health to understand the techniques used to promote resilience and wellness. This information allowed us to design the game with dialogues that are realistic, relatable, and relevant for continuing care workers.

bearinmind_jay

A Bear to Call Your Own

One main charm of Bear in Mind is as the name suggests, the teddy bear mascot. Asides from giving the app a welcoming feel, this helps to make the learning more personable.

A design decision was made to make the teddy bear customizable with different clothing. This allows the learners feel more empathetic with the teddy bear that embodies their choices inside the game.

Gathering Feedback From the Audience

In order to ensure that our game resonates with our audience, we took a user-centric approach of conducting playtest sessions with continuing care workers. The resulting feedback led to some UI changes which greatly improved the player experience. For example, the original design of the game included tasks inside the game that automatically complete each day. We learned from the feedback that players actually derived more engagement inside the game when they can manually check the tasks off by tapping on the screen.

Results

Raccoopack Media launched Bear In Mind on Google Play and the Apple App Store, with the purpose of helping continuing care workers learn stress management techniques in a fun an interactive way.

From carefully gathering user needs and feedback throughout the design process, the result is a gamified learning app that is intuitive to play and learn, while offering the advantages of convenience and accessibility altogether.

“Raccoopack was willing to meet us at our location to talk about the project. They were open to feedback and willing to offer their expertise; they were clear about what was in and out of scope, so we weren’t left guessing. The product they delivered was polished, meeting and in some instances surpassing our expectations.”
safecarebclogo_square
Katie Schultz
Learning & Development Advisor
SafeCare BC

Have an idea you want to see come to life?

rpmlogo