denkwerk

Struggly

Mathematics as a visual, creative object.

Best User Interface and Technical Achievement / Nominee

denkwerk

Best User Interface and Technical Achievement

Nominee

Struggly makes children (and adults) fall in love with math. Alina Schlaier, Co-Founder

Q: Can you briefly describe your project and the concept behind it?

A: Struggly brings together three high impact research spaces so that all children can reach their full potential: neuroscience, mathematics education, and growth mindset. Struggly lets children experience mathematics:
... as a visual, creative, connected subject
... with a focus on strategizing, creativity, and persistence
... in an explorative, inspiring, and engaging way
... with a growing self-confidence in their intellectual abilities

Q: Once you settled on your idea, what influenced your decision on the chosen technical approach? How did it differ or go beyond approaches you’ve taken in the past?

A: Right from the start we imagined Struggly as a web app instead of a native Android/iOS app. The browser-based approach allowed us to target a large audience and do quick iterations while being independent from various app stores' review processes. We had a lot of experience in building classic websites, but Struggly really challenged us to get familiar with more advanced web technologies including WebGL, drag and drop or audio playback.

Q: What were some of your biggest learning and takeaways from this project?

A: We were pretty amazed by the many things that are achievable within a web browser that used to work on native apps only. We also learned a lot about structuring a large-scale Nuxt app and how to share code between it and our API. Other learnings include the importance of accessibility, localisation of complex apps, secure setup of a user login and how to deal with save/load-mechanisms used in our games.

Q: What web technologies, approaches, tools, or resources did you use to develop this experience (WordPress, headless, AI, Sublime Text, HTML5, Adobe XD, etc)?

A: Struggly is completely written in TypeScript, which we considered a must-have regarding the size of the project. The app itself is built upon Vue and Nuxt, our API on NestJS, both using Node.js in a monorepo setup. Other technologies and frameworks we used include HTML/SCSS (big surprise, right?) and SuperTokens, Prisma, GSAP, Howler, WebGL, Jest and TestCafe to just name a few.

Q: How did the final product meet or exceed your expectations? What results did you see?

A: What amazes us the most are the many emails that tell us how children start to love math and how their performance and grades improve, sometimes dramatically, over time. And all the time kids are asking to play Struggly longer. Seldom can you derive such direct satisfaction from your work.

Q: Why is this an exciting time to create new digital experiences?

A: What has been done so far in EdTech is the digitization of math books. In comparison, Struggly has made several steps forward. We have made math visual, introduced a new math learning system, and incorporated intrinsic motivation (as used in successful games). It will be interesting to see how this will change the EdTech field.

Q: How did you reach a good balance of your own creative ideas and technical capabilities with a fair representation of the client’s brand?

A: We're a small team and we've worked together before Struggly. We are used to discussing all of our ideas together and testing them in working prototypes. Everyone on the team is focused on delivering the best possible experience for the kids.