Концепт № 188 из 336 · Практика и платформы

Фолио

Кроссплатформенное досье: одно дело выглядит одинаково на Windows и на маке.

Категория
Практика и платформы
Платформа
Windows · macOS · Web
Шрифты
Commissioner, Onest, Roboto Mono
Объём
7 КБ, одна HTML-страница
lawlabs.ru/demo/folio/
Фолио — первый экран концепта
01

Задача

Кроссплатформенное досье: одно дело выглядит одинаково на Windows и на маке. Макет про карточку, а не про бренд операционной системы.

Идея — все настольные.

Рабочее место для ежедневной практики: много данных, роли, связи между делами, документами и сроками. Интерфейс должен выдерживать нагрузку и не путать.

Платформа — Веб, macOS, Windows.

«Папка, которая едет с вами»Главное сообщение первого экрана
02

Структура

Страница собрана из 3 смысловых блоков: заголовок первого экрана задаёт тему, дальше — доказательства, сценарии и призыв к действию. Схема ниже повторяет иерархию заголовков прототипа.

H1Папка, которая едет с вами
H3Файлы
H3Участники
H3Офлайн
03

Цвет

Палитра собрана из стилей прототипа: фон, текст, акценты и промежуточные тона.

#EEF2F8фон
#142033текст
#1D4E89акцент
#516070тон
04

Типографика

Шрифты задают характер раньше, чем пользователь прочтёт первое слово.

Аа Бб Жж Юю 1995 §
Commissioner
Google Fonts
Аа Бб Жж Юю 1995 §
Onest
Google Fonts
Аа Бб Жж Юю 1995 §
Roboto Mono
Google Fonts
05

Экраны

Компьютер · 1440 px
Фолио — страница целиком
Фолио — мобильная версия
06

Прототип

Это не картинка, а работающая страница: кнопки, поля и анимации живые. Запустите прямо здесь или откройте в новой вкладке.

lawlabs.ru/demo/folio/
7КБ — вся страница целиком
3секции
0кнопок
0полей ввода
0SVG-иллюстраций
—без JavaScript

Практика и платформы — ещё концепты

№ 191 · ClauseOS
№ 191Практика и платформы

ClauseOS

Чертёж системы, в которой пункт — объект: у него автор, риск, версия и срок согласия.

Концепт · настольная
№ 193 · Место
№ 193Практика и платформы

Место

Интерфейс нотариальной конторы: очередь, проект, отказ, реестр.

Windows

Сделаем такой же — для вас

Возьмём концепт за основу: адаптируем под бренд, наполним вашими текстами и данными, подключим интеграции и запустим.