Mudia
@Mudia
Крутой

Есть ли недочеты в этом макете сайта?

5fdb626c001c9558279813.jpeg

Убрал куда подальшу бутылки, кофе и взялся для создания полноценного макета сайта для сервера игры Perfect World.
В этой работе постарался обратить внимание на множество замечаний, оставленных вами к прошлым мои работам.
Создавал его часов 30, много исправлял, переворачивал верх дном и в итоге смотря на этот макет, я уже не знаю, что исправить, чтоб улучшить визуализацию или же какие-либо грубые ошибки, в связи с мои небольшим опытом в этом деле.

От вас мне хотелось бы услышать недочеты в этой работе, на что обратить внимание, чтоб в дальнейшем не наступать на грабли, как в типографике, дизайне так и в структурировании самого сайта. Если же вам понравилась работа, дайте тоже знать.

Так же загрузил видео на ютуб, где можно детально просмотреть макет.
https://www.youtube.com/watch?v=7OgQyCE3ijc&featur...
  • Вопрос задан
  • 259 просмотров
Решения вопроса 1
sfi0zy
@sfi0zy
UI developer. Верстаю неверстаемое.
  • Белый по светлому не читается. Белый по пестрому - тем более. Голубой по голубому - ох...
  • Странное смешение шрифтов с засечками и без. Никакой системы в этом не наблюдается. Какую задачу эта разница решает - непонятно.
  • Очень много разных размеров шрифтов и межбуквенных интервалов. Проблема та же - нет системы.
  • Отступы везде разные. Внизу их вобще нет. Проблема та же.
  • Местами намешана информация. Глаза разбегаются. Здесь явно прослеживается идея поэкранного скролла, или чего-то вроде него, но стоит подумать над тем, чтобы каждый экран был о чем-то одном. Первый про то, что это такое (зачем там какие-то характеристики про опыт и духов?), дальше описание сервера (зачем там реклама справа?), магазин вообще спрятался в куче рандомных фактов по краям, я его в первый раз даже не заметил.
  • Не совсем понятно, как это должно адаптироваться под разные размеры экранов.

В целом докапываться можно много к чему, перечислять нет смысла, но общий посыл такой:

  1. Обращайте внимание на систему в дизайне. Загуглите, что такое дизайн-система и почему простота и последовательность - это хорошо.
  2. Думайте больше о доступности и адаптивности. Вы дизайн делаете для пользователей в первую очередь. Красочная картинка вторична.
  3. Не нужно нагромождать все, как в газете. Это очень редко работает. Управляйте вниманием пользователей, не давайте ему растекаться во все стороны.


P.S.: Также в таких проектах всегда нужно быть готовым к диалогу с разработчиком и не допускать требований pixel-perfect по согласованным без него макетам. Это не так сложно сверстать, но вот эти штуки по краям с линиями и кубиками будут генерироваться на лету (для адаптивности). Они не будут 100% соответствовать нарисованному. Также тут так и напрашивается все эти картинки анимировать, как на текущем сайте mtg. Не знаю, как этот стиль называется, но WebGL - наше все. Да и эти кубики я бы сделал неспешно плывущими более-менее вниз с покачиваниями и поворотами... Но это уже следующий шаг. Первое - система в дизайне и доступность.
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
bestowhope
@bestowhope
Печатает...
1. Тени у текста в 1м блоке нужны - иначе белое на белом читаться не будет, все верно. НО. Они слишком грубые. Сделай их мягче. Пример

2. Макет надо выкладывать не на ютуб, а картинкой. Это у тебя воровать никто не будет.

3. Использовать не более 3х начертаний одного шрифта.

4. Белый текст на голубом читается, но если голубой будет ярче - уже нет. Так что щас 50/50. Черный на голубом точно не вариант. Ты сделал верно по цвету, но сделай гоубой чуть темнее.

5. Вопрос "Как начать играть" не дает по факту ответа.
-Регистрация (еще понятно)
-Клиент (и че?)

Зарегистрируйтесь. Скачайте клиент игры. Скачайте игру. Запуск-игра

6. Игровой магазин потерялся где-то в pizде черного фона

7. "Проморолик" - аналогично с тенями.

8. В последнем блоке иконки:
а. Разного стиля - это недопустимо. Скачай сет иконок соц.сетей если не умеешь сам рисовать.
б. Добавь расстояние между ними. У всего на сайте должны быть верные отступы.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы