Обложка канала

Analysis Paradisis

Канал про системный анализ и управление IT-проектами. Обзоры книг по тематике, истории про IT-компании и полезная информация для аналитиков и менеджеров.

Analysis Paradisis

6 лет назад
Открыть в
Сторифреймы или дизайн интерфейса через текст

Когда мы начали делать приложение, у нас с тренером была только идея и то совершенно не новая — домашние тренировки. Дизайнера и разработчиков не было, команда сформировалась сильно позже, а я пока пыталась набросать скелет интерфейса и сценарии, чтобы разложить по полочкам то, как человек будет тренироваться, где получать достижения, как смотреть свой прогресс. Чтобы прийти к дизайнеру уже с чем-то конкретным.

Я брала кучу листов А4 и пыталась сразу что-то нарисовать: блоки, переходы, элементы. Перерисовывала тысячу раз: что-то не влезало, что-то нужно было поменять местами. Хорошо, что не начала сразу с рисования в фигме или инвижн, наверняка обнаружила бы себя через неделю в сотых попытках сделать красивый градиент на кнопке вместо общей логики.

Через пару дней я вспомнила про технику из Designing products people love — там была глава "интерфейс начинается со слов". Я начала набрасывать экраны словами в блокноте на ноутбуке, примерно вот так:

(фото)(лого школы) Иванов Иван
--редактировать профиль--
10 тренировок/ 5 дней подряд/ 1 достижение
Программы:
Техника, уровень "ученик", день 3/21
...
Главная/Круг скиллов/Достижения

И интерфейс "нарисовался" за вечер, а потом легко перенесся на бумагу. Просто потому, что и править текст намного быстрее, чем рисунки, и оперируешь не блоками, а конкретными словами — сразу понятна общая картинка экрана и логика. С дизайнером потом было очень легко общаться по получившимся наброскам и итог был очень похож на то, с чем пришла я.

Техника эта называется "сторифреймы" и я наверняка делала ее не по всем правилам, но сработало отлично. Теперь делаю так, если думаю про какие-то крупные куски продукта.