ABSC — лендинг IT-компании для медицины
Собрали для ABSC, команды, которая создаёт цифровые платформы для клиник, одностраничный сайт: слайдер проектов, ключевые цифры, структура команды и контакты с картой. Сайт выпустили за четыре дня, а его анимации держат 60 кадров в секунду.
Задача
ABSC — команда из Ташкента, которая на заказ разрабатывает цифровые решения для медицины: платформы для хранения и обмена медицинскими данными, телемедицины и управления клиникой. Её клиенты — клиники и медицинские специалисты, которым нужны IT-системы под их процессы.
ABSC на заказ разрабатывает цифровые решения для медицины. Компании требовался лендинг IT-компании, который сразу отвечает на вопрос клиники: понимает ли эта команда и технологии, и медицину. Типовой сайт студии со списком услуг здесь не подходил — требовался ясный фокус на медицинских платформах.
Показать опыт тоже непросто. Проекты для клиник часто нельзя раскрывать в деталях, поэтому их нужно было подать как понятные типы решений — платформа данных, телемедицина, система управления клиникой — с коротким описанием и без технического жаргона.
В заказной разработке клиент прежде всего выбирает людей. Сайт должен был показать, из кого состоит команда и какие роли закрывают проект: от руководства и продукта до инженеров, дизайна, контроля качества и безопасности.
Визуально требовалась современная динамика: бегущая строка, счётчики, вращающийся текст и появление блоков при прокрутке. Такие эффекты легко превращаются в рывки на слабых ноутбуках и телефонах, а на всю работу было четыре дня.
Решение
Мы выстроили страницу как знакомство с командой. Первый экран говорит «Привет, мы ABSC» и формулирует позиционирование — цифровые платформы современной медицины. Дальше идут рассказ о компании с видео, бегущая строка направлений, проекты, ключевые цифры, структура команды и контакты.
Навигация по якорям ведёт к четырём разделам, а кнопка «Связаться с нами» в шапке сразу набирает номер компании. В контактах — адрес, часы работы, ящик отдела продаж и техподдержки и встроенная Яндекс Карта, чтобы офис было легко найти. Видео о компании открывается в модальном окне поверх страницы.
Под капотом — React, TypeScript и сборщик Vite. Анимации на Framer Motion стартуют, когда блок появляется в поле зрения, нижние секции догружаются отдельно, а фотографии сжаты в WebP и грузятся только тогда, когда до них доходит очередь. Сайт работает на Vercel.
Позиционирование в первом экране
Первый экран начинается с приветствия «Привет, мы ABSC» и крупного заголовка о цифровых платформах для медицины. Рядом — короткое пояснение, как команда помогает клиникам и специалистам, а командная фотография задаёт тон всей странице.
Видео о компании
Кнопка воспроизведения окружена вращающейся надписью «Узнать о нас» и открывает видео в модальном окне поверх страницы. Рядом раздел «Чем мы занимаемся» объясняет, что ABSC работает на стыке технологий и медицины и упрощает процессы клиник.
Бегущая строка направлений
Под рассказом о компании бежит строка с ключевыми направлениями: медицинские платформы, телемедицина, клинические системы, цифровая медицина, медицинская аналитика. Посетитель за секунды считывает профиль команды, не читая длинных абзацев.
Проекты в слайдере
Реализованные решения собраны в слайдер: платформа управления медицинскими данными, платформа цифрового здравоохранения с онлайн-консультациями и система управления клиникой. У каждого слайда — описание, кнопка «Узнать подробнее» и счётчик позиции.
Цифры, которые считают сами
Под проектами — четыре счётчика: реализованные проекты, медицинские организации, пользователи платформ и доступность сервисов. Числа набираются анимацией, когда блок появляется в экране, и привлекают внимание к масштабу работы.
Структура команды и контакты
Раздел «Структура» показывает карточки команды с ролями от CEO до инженера по безопасности и ссылками на профили в соцсетях. Замыкают страницу контакты: адрес в Ташкенте, часы работы, почта и Яндекс Карта с отметкой офиса.
Результаты
Главные итоги проекта в цифрах.
- 3Медицинские платформы
Платформа данных, телемедицина и система управления клиникой собраны в одном слайдере проектов.
- 60 FPSПлавность анимации
Бегущая строка, счётчики и появление блоков идут с частотой 60 кадров в секунду.
- 4 дняСрок разработки
Лендинг собрали и выпустили за четыре дня.
- 6Разделов на одной странице
Приветствие, рассказ о компании, проекты, цифры, структура команды и контакты уместились на одной странице.
Дизайн и интерфейсы
Ключевые экраны и интерфейсы проекта.
Технологии в проекте
Стек, на котором мы строили решение под задачи клиента.
- Vercel
- TypeScript
- React
- Vite
Готовы стать следующим кейсом?
Расскажите о задаче — менеджер соберёт команду, посчитает смету и пришлёт коммерческое предложение в первый час после заявки. Без обязательств и без рассылок.