x
 
Иван
17 августа 2016
Советы почтой каждую неделю
Пожалуйста, получите наше письмо, чтобы подтвердить свой адрес:
Вы подписаны на «Советы за неделю»:

Делаю редизайн странички на сайте. На текущий дизайн есть обратная связь, что на странице «воспринимаются от силы только главное видео и первых два маленьких, остальные просто пролистываются. Причина кроется в размещении контента друг под другом. Однообразное размещение замыливает взгляд, глаз не цепляется и нет желания кликать на видео.»

Сделав несколько вариантов с размещением видео в шахматном порядке, всё равно остался с ощущением, что что-то не так. Но как сделать интереснее, при этом кардинально не меняя дизайн (так как меняется дизайн только одной страницы на сайте), непонятно. Наверное, ключевой вопрос здесь в том, как разнообразить вёрстку из модулей, когда они все одинаковые?


Иван!

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

Проблема не только в отсутствии чередования ритма. Бросается в глаза, что большую часть страницы занимает сопроводительный невнятный текст, контактные данные чужой компании, плашки и поля. Видеороликам, главным объектам на странице, отдано меньше 50 процентов площади. Какой уж тут интерес? Напоминает страницу интернет-магазина «Плеер.ру»:

37 сигналов. Эпицентрический дизайн
«Плеер.ру» атакует менюшками, хлебными крошками, формами поиска, банерами и плашками. А главное действующее лицо — изображение товара — занимает меньше одной десятой страницы

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

Сколько места! Займём его видеороликами и заодно подкрутим чередование ритма:

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

Ну вот, окружение не мешает смотреть ролики. Мораль: чтобы не получить монстра типа «Плеера.ру», начинайте работу над макетом с главных элементов, не обращая внимания на второстепенные.

Ещё идея для вашей страницы: чтобы ролики цепляли взгляд, подбирайте интересные стоп-кадры. Например, первый ролик не спасает ни размер, ни позиция.

Кстати, треугольничек «Играть» лучше делать по ширине больше высоты, чтобы его форма согласовывалась с направлением:

Плохо
Тупорылый треугольник указывает куда угодно, но только не направо
Так себе
Равносторонний треугольник лишён динамики, показывает в три стороны
Хорошо
Слегка вытянутый по ширине треугольник стремится в ту сторону, куда указывает

Треугольник лучше слегка смещать вправо относительно геометрического центра, чтобы визуально компенсировать разницу между тяжёлым левым и лёгким правым краями.

P. S. Это был совет по средам о вёрстке и типографике в вебе. Хотите знать всё об интерлиньяжах, полях, отступах, кеглях, выравниваниях и модульных сетках? Присылайте вопросы.

Типографика и вёрстка — дисциплина Школы дизайнеров. Набор открыт. Чем раньше поступите, тем ниже стоимость и выше шанс на бесплатное место.
 

Поделиться
Отправить

Комментарии

Роман Буянов
17 августа 2016

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

Прежде чем тратить время на говорящие головы, хорошо бы узнать кратко, что интересного делает эта команда. Текстом и осмысленными иллюстрирующими картинками, чтобы быстрее. Как вариант, можно рассказать об этом в первом вводном видео на минуту-полторы — тогда стоит указать у видоса его длину, чтобы были ясны затраты времени на просмотр.

Вместо батареи «поделиться–твитнуть» лучше дать ссылки на команду во всех этих соцсетях и на страницу вакансий на хедхантере или сайте компании, чтобы наконец узнать, кто вообще им нужен.


Цель рубрики — обсуждение вопросов дизайна всех видов, текста в дизайне и взаимоотношений дизайнеров с клиентами.

Мы публикуем комментарии, которые добавляют к уже сказанному новые мысли и хорошие примеры. Мы ожидаем, что такие комментарии составят около 20% от общего числа.

Решение о публикации принимается один раз; мы не имеем возможности комментировать или пересматривать свое решение, хотя оно может быть ошибочно. Уже опубликованные комментарии могут быть удалены через некоторое время, если без них обсуждение не становится менее ценным или интересным.

Вот такой веб 2.0.

3 3 2 1




Недавно всплыло

Защититься от случайного нажатия «Сдаться» 1 Это какие‑то другие пиксели? Как они соотносятся? 2 Поделитесь соображениями, как работать, путешествуя 8 Что вы думаете о способе указывать цвету прозрачность в шестнадцатеричном виде вместо более традиционного RGBA? 3