PiperLab is the integration of the original Piper Computer Kit's coding software with a new web-based interactive dashboard and tutorial library.
PIPERLAB.
A "hands-on" interactive web platform for coding circuits & prototyping
THE PROBLEM.
The Piper Computer Kit’s software did not integrated circuit wiring with coding, proved to improve efficacy. Building on the Raspberry Pi version of Minecraft technical limitations slowed down engineering development time and created roadblocks to creating new gaming levels. Finally, the Minecraft gaming structure limited what educational simulations the team could design; therefore, limiting new tutorial subjects.
THE OPPORTUNITY.
With the drastic changes to the 2020 Q2 economy and market, I saw the strategic opportunity to lead the Piper Product department in developing a low-cost, learn at home software platform. With an ItsyBitsy micro-controller for the PiperLab Controller and the PiperLab web-based software experience anyone, anywhere, can access STEAM learning.
THE DESIGN.
Once hardware is assembled & connected to a computing device, launch the web platform to learn, code, or protoype.
IMPROVED PLATFORM.
To simplify the back-end architecture, we integrated the coding tutorials into the narrative based learning challenges. With goals to improve accessibility, bias and localization, we removed voice-overs, used text overlays, and limited characters to just make sounds. Finally, we the improved out of the box experience by removing updates and configuration.
IMPROVED CONTENT.
The new design system improved the educational efficacy through restructuring of levels and tutorials. The new level design integrates coding and wiring circuits into the same experience for more consistent building of knowledge and removing the fragmented learning in the original software experience. The new tutorial design introduces interactive simulations, assessment challenges, and problem solving prompts based on student's local community needs.
RESEARCH.
MARKET FIT.
PERSONAS.
USER JOURNEYS.
The market is flooded with coding apps, but there is a surprising gap in hardware-specific online IDEs. Hardware integration is a quick, cost rewarding & well-rounded way to learn coding.
Key demographics for PiperLab's transition online.
Mapping to determine MVP features.
USER NEEDS.
Low-cost platform
Home-learning = Online experience
Narrative-based learning
Diverse coding challenges
PLAYBOOKS.
TECH SPECS.
BRAND GUIDELINES.
DESIGN PRINCIPLES.
- Fresh: universally age appropriate
- Flat: content pops out from interface
- Fun: Playful elements sprinkled throughout
DEVELOPMENT.
USER JOURNEY.
SCRIPTING.
ITERATIVE SPRINTS.
FEATURES.
THE USER-FOCUSED SYSTEM.
The interface and content implementaiton system were designed with the eventual goal of turning over control to the user. Every interface is a widget that can be hacked by the user through a customization tutorial; each feature in turn becomes a teaching aid in demystifying software design. Additionally, all content is implemented with automation tools like text and graphical editors like the one in this video. All implemented, intial features have long-term design goals that have been concept tested and validated; in turn, shortening the overall development time.
LIVE FEEDBACK PROTOCOL.
In the original software design, the hardware required a separate & long configuration process to work around the uploading protocols. With the newly implemented USB serial protocol, feedback is received in real time for more efficient troubleshooting & configuration of the hardware. This feature also allows users to troubleshoot live by accessing the serial console.
INTERACTIVE STORYTELLING.
The market demands competitive coding experiences above all other Computer Science curriculum. Therefore, this system structures the UI around the coding IDE. Using transparent overlays for graphics, character animations, and interactive simulations, narrative-based lessons can still guide the user through the experience without distracting from the coding focal point.
2D DESIGN.
Click through to see early storyboarding of characters interaction in their world with the limitations of the overlay / zoning system. The use of zoning allows for content automation without limiting user interaction with the characters or simulations.
DASHBOARD UX.
When developing the dashboard to allow non-developers to implement content, track metrics, monitor the platforms longterm KPIs, and evaluate efficacy, I discovered an opportunity to design it to be user facing. The goal is to create an Educator friendly dashboard that allows users to generate additional content for their students, but also for Piper's larger community. It will give teachers the ability to monitor their students progress and their content's efficacy.
MENU SYSTEM.
Updating the experience online, required restructuring to the menu flow & UI. On top of visual design, a "kit selection" feature has been introduce to allow users to quickly curate their experience. A "save projects" feature was introduced. Using cookies rather than a login system ensures user safety protections while still providing a personalized experience.
MOCKUPS.
