Чуть больше месяца назад на Хабре проходил конкурс от интернет-издания ToWave.ru, в котором предлагалось хабраюзерам высказывать идеи, замечания и предложения по развитию проекта. Призы были интересные — три планшета Samsung Galaxy Tab 2 7.0 P3110 8Gb, два планшета Samsung Galaxy S WiFi 5.0 8Gb и полезные книжки. Я, к сожалению, заметил конкурс только спустя несколько дней после старта, и большинство полезных идей и советов было уже высказано. Но, как говорится, лучше один раз увидеть, чем сто раз пр��читать.
Поэтому решил разбавить комментарии визуальным представлением дизайна. Большим недостатком старой версии сайта была плохая читабельность новостей и статей — самой большой ценности ресурса. В получившемся дизайне я хотел уменьшить количество информационного «мусора» и улучшить типографику (кликабельно):
inturist: Когда задумывал конкурс, я думал, что большинство критики будет по поводу контента. Всегда полезно слышать, в ту ли сторону идет проект. Но неожиданно бОльшую критику вызвал сам сайт, чего уж не ожидалось. Причем, мы его видим-то каждый день! Но как-то увлеклись поисками лучшей подачи контента и не заметили, что сам сайт волнует пользователя не меньше.
Причем высказанная критика по дизайну так сильно «била», что не смог дожидаться завершения конкурса и уже через сутки после первых замечаний начали понемногу переделывать сайт. Невыносима была сама мысль, что мы стараемся для читателей, а им оказывается не очень комфортно читать.
Ну и когда мы убрали второе верхнее меню, дополнительные блоки и начали править верстку — Кирилл опубликовал свой набросок дизайна. И стало ясно, что нужно переделывать все и кардинально.
grokru: Конкурс завершился, я выиграл один из Samsung Galaxy Tab 2 7.0 P3110 8Gb, и inturist предложил проработать дизайн остальных страниц. Пришлось поломать голову над главной: равноценного контента много, необходимо было аккуратно представить его на странице. Вот как сайт выглядел раньше (в этом хабратопике есть еще более ранние скриншоты):
Было необходимо свести к минимуму количество элементов интерфейса, визуально отделить разные типы контента. В итоге получился такой концепт (кликабельно):
Существовала мобильная версия сайта, но было решено делать дизайн адаптивным. Навигации была реализована на основе техники, о которой я писал на хабре не очень давно.
Верстка была доверена мне, поэтому в процессе можно было поэкспериментировать с разным представлением контента на сайте. На этом этапе добавил немного контраста (в основном это касалось типографики). В результате получился окончательный вариант редизайна интернет-издания ToWave.ru.
Небольшое лирическое отступление, связанное с несколькими недавними хабратопиками о работе веб-дизайнера и верстальщика: в последнее время я разрабатываю дизайн в основном для зарубежного интернета. И вот, что интересно: подобных противостояний там не наблюдается, потому что web-designer — это специалист, который умеет проектировать, отрисовывать дизайн и верстать в html. Согласитесь, это немного отличается от представлениях о веб-дизайнере в Рунете, где считается, что эта профессия сугубо творческая. В общем, списываю это на различие менталитетов.
Макеты дизайна в полном размере.
