Как работать без референсов

Это мой первый текст подобного рода, так что приготовьтесь)
Работа с референсами всегда вызывала у меня неоднозначные чувства, и вот недавно мне попалась задачка, к решению которой я решил не искать референсов. Дальше я буду описывать свой процесс работы, который, как мне показалось, может быть интересен и полезен другим.

Для начала нужно понять, какую информацию вы хотите показать на экране или любом другом устройстве вывода(в этой статье я буду использовать условный экран). Список этой информации вам может предоставить клиент, а может и нет.
Например: На экране нам нужно показать аватарку пользователя, имя, возраст, стаж работы и т.д.
Если клиент не сказал ни слова, то вам нужно сделать шаг назад и провести небольшое исследование исходя из цели экрана и нужд потенциальных пользователей. Возможно, это будут интервью, гугл-форм опросы и т.д После этого вы сможете понять примерный список информации которую вам предстоит поместить на экран.

На этом этапе когда у вас есть примерный список информации, вы можете начать приоритизировать ее. Следует выбирать самые важные пункты исходя из интересов клиента и пользователя. Я обычно просто расставляю в порядке убывания тот список информации, что был до этого.

Здесь я обычно смотрю на способ вывода информации. Представим, что это фрейм 1000x1000px. Так мы сможем понять, сколько вообще информации поместится на экране, чтобы она была воспринимаема пользователем. Если пропустить этот шаг, то можно попасть в ловушку и на экране получится каша.

Тут нам желательно выбрать формат, в котором мы будем показывать информацию.
Например: Нужно показать заработную плату сотрудников за последние 6 месяцев.
Это можно сделать с помощью обычного списка, а можно нарисовать диаграмму. Можете подготовить пару разных форматов для одной и той же информации, лишним не будет. Определяемся с тем в каком формате будем показывать информацию. Мы берем информацию по списку, над которым мы работали во 2 пункте.

Тут мы уже приступаем к расстановке элементов, которые собрали на прошлых этапах. Как их расставлять? Очень просто, здесь нам поможет наш список приоритетов. Чтобы показать самые важные элементы или информацию, обычно я пользуюсь базовыми инструментами:

Эти инструменты работают в обе стороны Это, наверное, самый трудоемкий процесс. Не волнуйтесь, если все не станет на свои места с первого раза, это нормально. Это как собирать лего, вы можете собрать из одного набора деталек лего совершенно разные штуки. Так же и тут, нормально, когда у вас 3,4,5 и даже больше разных расстановок и форм элементов.

На этом этапе у вас должно быть пару вариантов, которые вы можете показать клиенту на выбор, либо выбрать сами. Критерии выбора чаще всего основаны на визуальном аспекте, чем на функциональном. После этого этапа вам скорее всего надо будет внести некоторые правки в ваш дизайн. Хотя может быть и такое что дизайн будет 100% воплощение того, что хотел клиент и вы сможете перейти к тестированию.

🥳 Поздравляю! Вы дошли до конца, вы молодец. Некоторые шаги вы можете пропускать, менять местами или дополнять своими. Это не приказ, обязательный к исполнению, а просто дружеская рекомендация.

Если у вас есть методики которыми вы пользуетесь, буду рад почитать о них в комментариях.

Всем хорошего дня💚