From a course library to an educational marketplace and social ecosystem for creators

Infourok is the largest Russian online educational platform, bringing together learners, teachers, educational content creators and experts

At the time of the project, Infourok was already one of the largest players in the Russian education market. But its model was changing: the product had to grow from a library of educational content into a marketplace and a social ecosystem for creators and learners

The client came to aic for a comprehensive refresh of its brand and digital products. The visual update was only part of the task

Business model

The product had grown, but its interface and visual language no longer matched its scale and new strategy. The platform had to do more than help people consume content: it had to create conditions in which creators come to publish and sell educational products, while the platform earns a commission

I don't have final post-launch figures: I left the project before the measurements were completed. So below are the goals and metrics the product was aiming for, not results

I was a Senior Product Designer on aic's external design team. Together with the art director and the brand designer, I helped shape the visual concept, and once it was approved I was responsible for a large part of the product design and led the work of two middle designers

Area of responsibility

Team

Most of the discovery was run by Infourok's product team: interviews, surveys, Yandex Metrica analysis, user typologies, feedback collection and reviews with educational content experts.

I wasn't the lead researcher. My work started with interpreting the findings and turning them into UX decisions: IA, CJM, user flows, prototypes and UI.

Competitive analysis

The product was becoming a marketplace and a social platform, so we looked beyond direct competitors and searched for product patterns rather than visual references.

From simple registration to a personalized learning experience.

Flow: registration → role → interests → subjects → specialists → goal → personal feed

01 / 02

Three content types – one framework for search and selection.

Courses, events and materials had historically lived in separate catalogs, each with its own logic. With millions of content items, users need to narrow down results quickly, and the platform needs to show equally clear cards that are easy to compare and decide on.

What's shared

What changes: a card for each content type

01 / 02

Mobile version

On mobile, filters and sorting move into separate full-screen layers: the results stay clean, and complex filtering doesn't break scrolling.

01 / 02

Not a single beautiful landing page, but a builder that assembles a page for any course.

AS IS

The old course page was a long landing page: blocks were repeated (the "Start learning now" call to action appeared twice), the benefits took up several screens, and the essentials – dates, certificate, price – got lost. The page for each program area was essentially assembled by hand.

01 / 02

Solution: the master page

I built a master page – a library of ~28 modular blocks with a single grid and set of rules. Each block answers one user question.

01 / 04

One system – different goals and color schemes

The master page is used to assemble pages for different product types. What changes is the set and order of blocks, the accent color and the certificate block – depending on what matters most for the purchase decision.

The "Certificate issued" block is an example of a component that adapts to the program type: a retraining diploma, a professional development certificate, or a mini-course certificate.

01 / 03

From scattered forms to one clear scenario.

AS IS

In the version we started from, the application was split across several states and screens: "access closed", card payment right in the course list, personal details, documents and delivery address – all in different places. Users couldn't tell what had already been done and what was still needed to receive their certificate.

TO BE

The application became a single page with sequential steps. On the right are the application status and a personal advisor users can contact at any time.

Three application states

There was no unified design system at the start. Once the brand language was approved, we built the UI foundation from scratch.

Brand → tokens → UI Kit → components → patterns → product

Key scenarios went through a cycle: problem → hypotheses → options → prototype → testing → final UI.

What we managed to do: hallway testing, internal UX reviews, expert interviews and surveys with Infourok's team of content specialists.

Stakeholder management

Infourok had a strong product team but no in-house design ownership, and on a number of issues the final say rested with a leader who had his own vision. Sometimes the team supported a decision and the leader didn't.

• Argued for decisions through the user's task and the business goal
• Presented several options rather than defending a single design
• Proposed testing instead of debating taste
• Once a business decision was made, adapted the design without losing the core UX logic

Development and handoff

The client had in-house developers and contractors. I worked directly with the frontend and backend leads, discussing feasibility, constraints and the documentation format – component states, responsive rules, annotations, edge cases.

Process: design → design review → development discussion → handoff → design grooming → implementation

After I left, the team continued to receive design support from aic during implementation.

By the end of my involvement, the foundation of Infourok's new product model and visual system was in place.

Product homepage. Web

01 / 05

Product homepage. Mobile web

Creator account page. Web

Creator account page. Mobile web

Course catalog. Web

01 / 02

Course catalog. Mobile web

Materials catalog. Web

Materials catalog. Mobile web

Events catalog. Web

Events catalog. Mobile web