Category: дизайн

Category was added automatically. Read all entries about "дизайн".

Слишком ровный правый край

Продолжаю серию статей про неудачные приемы верстки.

Когда дизайнеры впервые узнают о принципе модульности и о том, что прямоугольники нужно закрывать, они начинают прямоуголить всё что ни попадя. Например, ровнять правый край текста. Особенно часто так поступают с заголовками: разбивают на строки одинаковой длины, чтобы получился ровный прямоугольничек:




Или по-другому:




Иногда, конечно, так можно сделать, но превращать это в привычку не стоит. Правый край при флаговом наборе должен оставаться рваным, это его естественная форма:




То же касается и сборных модулей, и макета целиком. Слишком гладкий правый край делает верстку кирпичной:




Воздух справа — это дополнительный ритм и динамика. Даже такая неидеальная форма лучше вымученного прямоугольника:




См. также: Выключка по левому краю

Серия «Неудачные приемы верстки»
Горки текста
Ноги текста
Колонки разной ширины
Бутерброды текста
Картинка без модуля
Слишком ровный правый край

Мягкий люстровый свет

Чтобы люстра давала ровный и мягкий свет, нужно выбирать такую, у которой:
1) несколько лампочек
2) матовые плафоны, в идеале — молочные
3) плафоны направлены вверх

У меня дома приятней всего светит вот эта люстра. Фото совершенно не передает характер освещения, зато передает люстру:

Троечка ссылок — 47

Про дизайн интерьера:

1. Как живут коллекционеры: раз и два. (Спойлер: охуенно.)

2. Австрийский дизайнер Андреас Шайгер делает крутые предметы интерьера из старых велосипедов.

3. На сайте Rawpixel можно бесплатно и легально скачать старые картины, гравюры и орнаменты в хорошем качестве. Я скачал вот такие:

Демонтаж в сталинке

Демонтаж в старом фонде — очень ответственное мероприятие, особенно если вы хотите восстановить былую красоту. Расскажу, как всё прошло у меня.

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




Collapse )

«Большая переверстка» в декабре

Следующий мастер-класс пройдет с 7 по 26 декабря. Подробности и запись в группе: vk.com/pereverstka_online




Отзывы о «Большой переверстке» в октябре.

Вера Метелева:

Алгоритм верстки — классный. Понравилось, что в итоге все работы делаешь по нему, а при разборе видно, где именно у тебя пробелы. Обратной связи много, вебинары очень интересные. Большое спасибо за онлайн!


Антон Калинин:

Для дизайнера цифровых продуктов верстка и макетирование — не единственное, но очень важное умение. Было некомфортно и порой даже сложно целый месяц верстать обложки, плакаты и таблички. Зато потом наступило просветление и катарсис. Поэтому если вам кажется, что вы более-менее освоили все навыки в профессии, хороший способ развиваться — прокачивать скиллы изолированно, и курс Игоря подходит для этого прекрасно.

Переверстка №31. Подписка на Cover Commander

Nail пишет:

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

Самое сложное для меня — блок покупки с ценами:



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

Collapse )

Сайт «Веб-стандартов»

В прошлом году нарисовал сайт для «Веб-стандартов».

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

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



Если картинки нет совсем, ее место занимает один из фирменных паттернов ↓

Для верстки статей разработан полный набор стилей: заголовки, выноски, цитаты, списки, иллюстрации, фрагменты кода и т. д.:

Чтобы новый дизайн не потерял связь с прошлой версией «Веб-стандартов», мы сохранили знак и сине-зеленую гамму.

К сожалению, разработчики сверстали сайт без моего участия, поэтому я показываю свои макеты, а не скриншоты. Найдите сто отличий :–)


Иконки и паттерны: Алексей Грабилин
В эпизодах: Сергей Мусаилов
Шрифты: RF Dewi и RF Rostin

Интерьеры в фильме «Работа без авторства»

Смотрел фильм, а видел одни интерьеры, настолько они хороши. Больше всего меня удивило разнообразие настольных ламп. Всего я насчитал 47 моделей, но мог ошибиться на одну-две.

Покажу, что понравилось.

Дом в Гросшёнау, 1937

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




Collapse )

Переверстка страницы FAQ

Дизайнер Дженсон Камби рассказал о переделке сайта The New Yorker Festival и в частности о том, как поменялась страница FAQ. Было и стало:


festival.newyorker.com/faq/


Автор описывает изменения очень коротко. Я хочу рассказать подробнее, потому что это классный кейс. Итак, что он сделал и почему это хорошо:


  1. В старой версии ответы были скрыты за аккордеоном, в новой они все на виду. Страница стала длиннее, но это неважно, потому что скроллить намного легче, чем кликать.

  2. Прошлый вариант выглядел статично и однообразно, так как состоял из одинаковых прямоугольных контейнеров. В новом дизайне текст освободили от плашек и добавили непрямоугольные иллюстрации. Композиция стала динамичнее и разнообразнее.

  3. Основной текст переходит из одной колонки в другую, еще плюс один прием к динамике. Удачное решение для длинного материала.

  4. У страницы появился заголовок. Он крупный, красный, набран другим шрифтом, поэтому хорошо контрастирует с основным текстом. В предыдущей версии текстовый контраст был слабым.

  5. На контраст работают и картинки. Даже в небольшом размере они заметно отличаются от текста тоном и пластикой.

  6. Вопросы набрали строчными буквами, чтобы их было легче прочесть.


Как результат, страница похожа не на панель управления, а на статью.

Делайте как Дженсон.

Интерьерные аккаунты в Инстаграме — 2

Свежая подборка красоты.


1. igorjosif — квартира Игоря Йосифа в Мюнхене. Игорь — основатель блога Urban Jungle и автор одноименной книги.




2. piga_haus — большая старая квартира в Познани, Польша:




3. bureau.slovo — русское интерьерное бюро:




4. alexanderwhitesthlm — агентство недвижимости в Стокгольме:




5. residencemag — шведский интерьерный журнал:




6. solebich — немецкий интерьерный журнал:




7. pro.kresla — московские ребята реставрируют старые кресла и стулья:




8. sklarna — другие московские ребята делают невероятную посуду из стекла:




9. objectpertinence — разные красивые картинки:




10. Магазины винтажной мебели, света и предметов интерьера:
na_4erdake
glav.vintage
tree_house_son
kamorka.workshop
otsek_vintage
ussr_interior_design