Примеры дизайна
Макеты, которые я рисую сам и потом собираю в код. Выберите направление — нарисую первый экран под ваш бизнес.
Что на этой странице
Семь направлений и девятнадцать примеров: лендинги, сайты, каталог, экраны приложений, админ-панель, логотипы с иконками и фирменный стиль на бумаге. Любой можно взять за основу — перекрасить под ваш бренд и заменить тексты. Выберите, что ближе, и я нарисую первый экран под вашу задачу.
1. Лендинги
Один экран — одна мысль. Проверяю на телефоне, чтобы кнопка была видна без прокрутки.
2. Сайты и каталоги
Страницы для тех, кто уже знает, что продаёт: структура, сетка, типографика.
3. Экраны приложений
Android и iOS — разные макеты, а не одна картинка. Листайте: загрузка, главный экран, карточка товара, корзина, подтверждение, карта доставки, профиль и запись на приём. Цвет экранов можно переключить — посмотрите, как макет смотрится в вашей палитре.
Экран запуска
Приложение открывается со знака: название, подпись, полоса загрузки и точки — человеку не кажется, что телефон завис.
- полоса загрузки идёт от 0 до 100 %
- знак и название — из фирменного стиля
- на тёмном фоне видно даже на солнце
Главный экран
Приветствие, строка поиска, четыре быстрых плитки и заказы со статусами: в пути, доставлен, возврат.
- нижнее меню — по правилам Android
- статус заказа виден без открытия
- плитки ведут в разделы в один тап
Карточка товара
Фото, рейтинг 4,9 с числом отзывов, цена, три параметра и одна большая кнопка.
- рейтинг и отзывы под фото
- цена и параметры без прокрутки
- одна главная кнопка — меньше сомнений
Корзина и оформление
Три позиции с количеством, промокод, итоговая сумма и кнопка «Оформить заказ» — всё на одном экране, без лишних шагов.
- итог виден до нажатия
- промокод — отдельной строкой
- доставка посчитана заранее
Заказ оформлен
Подтверждение с номером заказа, суммой, способом оплаты и адресом. Человек понимает, что произошло и что дальше.
- галочка снимает тревогу
- номер заказа — крупно
- сразу кнопка «Следить за заказом»
Доставка на карте
Маршрут курьера, время прибытия и карточка «Позвонить». Видно, где заказ прямо сейчас.
- время прибытия — сверху
- звонок курьеру в один тап
- маршрут без лишних кнопок
Профиль
Имя, телефон, бонусы и разделы: заказы, история, избранное, поддержка. Ничего не спрятано в подменю.
- бонусы видны сразу
- четыре раздела — без вложенности
- выход отдельной строкой
Запись на приём
Карточка специалиста со свободным окном, три услуги с ценами, календарь и время, кнопка «Записаться».
- свободное окно видно сразу
- цена услуги до записи
- напоминание за 2 часа приходит само
4. Админ-панель
Рабочая панель для компьютера: заявки, клиенты, деньги. Для владельца, а не для программиста.
5. Название, в котором буква — предмет
Название можно не просто написать, а нарисовать так, что одна буква становится предметом: в пекарне это каравай, в кофейне — зерно, у горного клуба — вершина. Название при этом читается, а человек сразу понимает, о чём бизнес.
Те же названия проверяю на светлой плашке (сайт, визитка, бланк) и на тёмной (вывеска, упаковка, ночная шапка сайта).
6. Иконки приложений
Иконка — первое, что видит человек в магазине приложений. Рисую набор: иконка, экран запуска, заставка внутри приложения.
7. Фирменный стиль на бумаге
Логотип нужен не только на сайте: бланк, визитка, блокнот, стакан, вывеска. Показываю, как знак живёт в жизни, а не только на экране.
Нравится направление?
Скажите, какой пример ближе — нарисую первый экран под ваш бизнес. Дизайн можно заказать отдельно, без сборки сайта.