Ответ: Мои похождения в play как Developer-а
1. Консистенция в цветах.
Выбери какие-то определённые цвета для своего приложения. Например основной цвет фона, затем основной цвет текста. Для заглавков можешь немного его усилить в насыщенности или жирности шрифта. Для кнопочек можешь более активный цвет использовать, но желательно иметь консистенцию (какую-то логику в цветах и типе контента).
Присмотрись к нейтральным цветам, а не выжигающим глаза.
2. Консистенция в формах.
Определись какой формы кнопки, какой блоки. Если делаешь круглые кнопки, то делай их почти везде круглыми. Но лучше не делай круглых кнопок вообще :D
3. Консистенция в текстурах.
Градиенты или не градиенты? Вообще рекомендую забить на градиенты, т.к. в 95% это прошлый век.
4. Композиция.
Подумай где обычно пользователь кликает. Где ему удобно. и старайся располагать на экране кнопки так, чтобы юзер примерно уже знал, что сверху например обычно навигация (или слева), а снизу под-навигация. И т.п.
Также определись с блоками и их размерами, и самое главное расстояниями между блоков, кнопок и текстами, всякие padding'и и margin'ы.
Сделай их максимум 2 разных расстояний. Например основные блоки 16 пикселей, а второстепеные (отступ текста от краёв блока, расстояние между кнопками и т.п.) 8 пикселей. Или свои подбери.
Да и начни с листика бумаги.
1. Распиши тип информации который нужно предоставить игроку.
2. Распиши список view'ов, которые игрок сможет увидеть.
3. Разрисуй таблицу отношений этик видов, просто квадратик с названием вида, и линии соединяющие виды, между которыми игрок сможет перемещаться. Это назвывается user-flow.
4. Сделай наброски (wireframe'ы) каждого вида. Только композиция и примерное рассположение объектов, также элементов, например скроллящаяся область и т.п.
5. Пройдись по всему user-flow и найди не логичные места в набросках. Поправь. Повтори этот этап несколько раз. Попроси друга, сестру, жену, детей глянуть. Задавай много вопросов типо "что это за экран?", без объяснения что за экран. Если пользователь не понимает - значит твой дизайн не достаточно работает.
6. Как только это отшлифуешь, приступай к разработке дизайна цветов и конкретно форм. Лучше сперва на бумаге, даже если у тебя как у большинства программистов линии совсем не прямые. Возьми карандаш, и херач. Грубо но главное чтобы было что-то. Старайся делать меньше линий - это помогает.
7. Пройдись снова по всему user-flow и дизайнам. Сделай поправки.
8. Поспи.
9. Повтори 7 пункт. Как только это будет работать у тебя логически в голови и испытуемых. Приступай уже на компе. Тут уже всё проще и понятнее.
Такой процесс работы поможет тебе подойти к дизайну не с барахты, а более серьёзно, и результат будет подобающий если процесс отполируешь.
|