Case Study

Tener.ai landing page

Landing

Development

Animation

Idea

The main challenge was updating the existing platform with a focus on a unique visual identity. We chose the direction of Retro-futurism and Command Line Interface aesthetics. The main goal is to recreate the nostalgic experience of Windows 95 interfaces and terminal consoles, while maintaining the high usability and speed of a modern web application. This is a balance between a "raw" technical style and intuitive UX for an AI product.

Design and Style

Work on the visual language began with the development of presentations. We abandoned standard SaaS templates in favor of monospace fonts, a strict grid, and characteristic system elements (windows, progress bars, pixel icons) to create the feeling of a professional tool for developers and AI enthusiasts.

Framer Development

To implement the project, Framer was chosen as the primary development tool. This allowed for a reduction in the Time-to-Market, bypassing the mockup stage in Figma.

Framer Development

To implement the project, Framer was chosen as the primary development tool. This allowed for a reduction in the Time-to-Market, bypassing the mockup stage in Figma.

Animation

Animation has become a key element of user immersion. Using Rive, I developed complex vector animations for the main screen and sales funnel visualization. Unlike traditional videos or Lottie, Rive animations are fully interactive, have minimal weight, and work with State Machine, allowing the interface to instantly react to user actions, enhancing the feeling of a "live" console.

Animation

Animation has become a key element of user immersion. Using Rive, I developed complex vector animations for the main screen and sales funnel visualization. Unlike traditional videos or Lottie, Rive animations are fully interactive, have minimal weight, and work with State Machine, allowing the interface to instantly react to user actions, enhancing the feeling of a "live" console.

Blog

To ensure content flexibility, Framer CMS was implemented. This allowed for the structuring of the blog, enabling the team to easily add new materials without code intervention. The CMS architecture is configured to support the overall site style, automatically styling new publications with the project's general retro vibe.

Blog

To ensure content flexibility, Framer CMS was implemented. This allowed for the structuring of the blog, enabling the team to easily add new materials without code intervention. The CMS architecture is configured to support the overall site style, automatically styling new publications with the project's general retro vibe.