The Project

Bringing the magic of Joco to the world

A website that uses scroll interaction to tell the story of Joco, a conversational learning product for those micro-moments of boredom.

The Challenge

Transforming Concept into Interaction

Joco is an intelligent and adaptive conversational learning platform where users learn about major global transformations in 5-minute journeys. The challenge for the new website was to communicate the product in a simple and engaging way, using the "dance of the cubes" created for the new visual identity as its central concept. From the beginning of the project, we knew that implementing the cube animation during scrolling would be a challenge, and therefore, months of fine-tuning were required to achieve the desired level of interaction fluidity.

The Process

Constant interaction between client, design, and developer

The execution of this project was particularly characterized by a more free-flowing design team, both with the client, as it was an internal product, and with the developer, as the success of the core concept was closely linked to the feasibility of implementing and subsequently refining the animations in the code. Furthermore, because it involved standard product communication and sales content, the website structure didn't require any major innovations, so we opted to maintain a simplified architecture and focus all our efforts on a concept that would bring emotion to the experience.

Visual Identity

Knowledge is chaos. Joco organizes and delivers it in small portions.

This was the insight that led to the cube metaphor. They come together and form something larger. The user learns through conversations and can choose their learning journey, in an adaptive model. The images that are assembled are a reflection of the knowledge acquired from a "magic cube." In the learning pyramid, the more interactive, the greater the absorption, so we use game elements. And with this, we offer a sense of progression within the experience. The platform is intelligent and allows the extraction of data and insights of different natures. At Joco, we address the major transformations in our world: Tecno Box, the theme is digital transformation; Skill Box addresses life skills; Nutri Cuca, nutritional awareness. It's not over yet; there are more cubes being assembled.

Product Key

The Cube Dance

In the product key stage, we look for what will be memorable in the experience and will create an emotional connection with users. In the case of Joco, the cube metaphor emerged to visually synthesize various concepts present in the product's semantic universe. The personal, adaptive, evolutionary, and bite-sized journey was represented in the new identity by recombining the basic cube unit into different forms. On the website, cubes were used to tell the product's story, from its purpose to its hiring models. To this end, each content module is illustrated by combinations of cubes that never leave the screen, simply rearranging themselves as you scroll.

The Solution

But wasn't it just a landing page?

When we started developing the Joco Showroom, we thought it would be a landing page and that, in the absence of architectural, structural, and content-heavy challenges, we would focus all our efforts on the user's emotional connection with the product. However, throughout the process, we realized that to sell Joco's proposal as we wanted, we needed a more robust website, with specific pages to dive deeper into the content. To this end, the final solution included, in addition to the homepage, a methodology page describing the ingredients of Joco's recipe; a page discussing the specifics of the platform; a portfolio section showcasing case studies developed with various clients; and, finally, an institutional section containing the company's history, purpose, team, and contact details. With this solution, we had the opportunity to dive deeper into each of the particularities that make Joco unique and special, from the intangible value proposition to the most concrete and measurable details.

Results

See the project results

Joco was recognized by Design Rush - a leading trends and awards platform that has featured brands such as the NBA, McDonald's, Nike, and Sefa Spices - for its Best Design Awards, featuring the best educational website designs. You can see our award results on the Design Rush platform.