29 заметок с тегом

дизайн

Позднее Ctrl + ↑

UX VW: попробуй поставить стаканчик с кофе.

В дизайне есть два таких очаровательных понятия как UX и UI.

UX (он же user experience) — пользовательский опыт, то есть то, что получает пользователь при взаимодействии с UI. То есть насколько легко/сложно достичь той или иной цели (например: совершить звонок с сайта нажатием пиктограммы телефонной трубки или оставить электронную почту для связи)

UI (он же user interface) — пользовательский интерфейс, то есть то, что видит пользователь перед собой, то, какие характеристики приобретает интерфейс (например: адаптивность сайта к различным разрешениям).

Так вот пример плохого UX — это расположение подстаканников в автомобиле Volkswagen Polo, которое до сих пор для меня остаётся загадкой.
Проблема заключается в том, что выбрав Полик с автоматической коробкой передач, вы получаете следующий опыт:
взяв кофе с собой в абсолютно любом стакане и сев в немецкий автомобиль российского производства, вы не можете просто так взять и поставить кофе в подстаканники — селектор коробки передач, находящийся в режиме P (parking), на даёт этого сделать. Надо либо отпивать из стакана, чтобы его можно было наклонить и просунуть в подстаканник, либо переключать селектор на положение N/D/S.

Как так могло получиться — одним немцам известно.

На механике, скорее всего, такой проблемы нет.

2017   UX   авто   дизайн

Анатомия антиквенного шрифта

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

Исходный файл в pdf (300 dpi) для цветной печати здесь:
http://blinperm.ru/files/anatomia_shrifta.pdf

Пример в jpg:

Анатомия шрифта
2017   дизайн   типографика

Кёрнинг? Не, не слышал.

Мне нравятся магазины «Семья», особенно те, что поновее. Например, В Айсберге II. В них светло, аккуратно и как-то в целом приятно.
Мне нравится фирменным стиль «Семьи», разработанный Студией Лебедева: аккуратные иконки, минималистичные сменные консоли в навигации, заметные ценники.
Иначе говоря — всё честь по чести: упаковка самих магазинов теперь должна соответствовать уровню аудитории. Такой плотный, можно сказать упитанный, и современный «середнячок».

Но вчера я увидел ЭТО — добротную вывеску с надписью «Скоро открытие», где каждая буква живёт автономно от другой.
Я понимаю, для чего было использовать прописные буквы, но не понимаю, что стало с разрядкой?
Конечно, автор шрифта проектировал межбуквенный интвервал исходя из оптического равного расстояния между буквами, из того, что после прописной буквы будет идти строчная.
И совершенно прав автор макета в том, что надо изменять межбуквенный интервал при написании заголовков только прописными буквами.
Но почему Н А  С  Т О  Л Ь К  О?

Как там было в статье про подбор пальто? «Как прыщавая, щербатая девочка погубит весь ваш маркетинг?»
Тут можно сказать аналогично: «Как бухгалтер Василила Матвеевна погубит фирменный стиль, разработанный за хорошие деньги?»

Апроши Семьи

UPD:

А на другом баннере всё более или менее...

2017   дизайн

Удобный просмотр CSS в Chrome.

Открыл для себя расширение для Chrome, которое облегчает просмотр CSS.
Называется CSSPepper. Показывает он много всяких полезностей:

  1. используемые гарнитуры и шрифты, их кегль и прочие тонкости типографики;
  2. цвета на сайте и их HEXы;
  3. все изображения страницы (при нажатии на изображения их можно скачать);
  4. мета-теги;
  5. и прочие полезности.

Пример того, как CSSPeeper видит страницу новостей Яндекса:

Удобный просмотр CSS в Chrome

Поставить дополнение можно напрямую из интернет-магазина Chrome или
с сайта разработчика https://csspeeper.com/

2017   web   дизайн   Рабочие моменты

Несерьёзный подход

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

Итак, небольшое пособие по написанию номеров телефона в разделе контакты или в подписи отправляемых писем:

как не надо писать:
+7 912 999 99 99
7-912-9999999
8-(912)-999-99-99
+7 (912) 999 99 99

а как надо:
8 (912) 345-67-89 (это пример номера мобильного телефона)
+7 342 345-67-89 (а это пример стационарного номера в международном формате)

С почтой ситуация немного иная: успешный бизнесмен, рассказывающей о том, как успешно жить в успехе, предлагает связаться с ним по адресу uspeh@mail.ru. Или uspeh@yandex.ru. Серьёзно?
То есть эксперт, предлагающий свои курсы по цене сто тыщ мильёнов, сам не потратил и пяти минут времени на привязку почты к своему домену uspeh.ru? Или ему жалко отдать тысячу рублей за настройку почты? Или помощники бизнесмена лоханулись?

О мужчинах судят по часам и обуви.
Об успешных инфо-бизнесменах — по написанию данных в разделе «Контакты», подписи в письме и доменной почты.

P.S.
Кому интересно «Как привязать почту к домену бесплатно?» — https://yandex.ru/support/pdd/about.xml
За бесплатной консультацией «Что такое CNAME/MX? Куда это вписывать?» можно обратиться ко мне — ilya@blinperm.ru.

2017   дизайн   Рабочие моменты

Карлсон без этажа

Почему 90% застройщиков многоэтажных домов не используют такую простую вещь, как таблички с указанием квартиры-этаж?
Мелочь, а полезная. Она явно пригодится экстренным службам, курьерам (да, некоторые спрашивают этаж, но в путевом листе не указывают), и просто тем, кто ходит в гости раз в месяц. Да мало ли случаев бывает!

Схематично такую табличку можно показать так:

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

Макет «Шинный отель»

В конце прошлого года поступил заказ на создание рекламных макетов для одного из дилеров Toyota в ЦФО: было необходимо разработать три макета на такие услуги как проверка углов наклона колёс (развал-схождение), шинный отель, и регулировка фар. Идеи макетов нужно было придумать с ноля.

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

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

 

Дичь Дичь номер два
 

Почему дом? Потому что семья и дом — понятия схожие. Когда человек говорит «Я иду домой» — это значит, что он идёт к семье. Опять же, наиболее честен человек внутри семьи.
Целостность — синоним «целого». Целый дом. Целая семья. Все вместе и всё вместе.
Скромность же может выражаться в простоте используемых элементах, схематичности изображения, сдержанности подачи информации целевой аудитории.
Итог: «Мой дом — моя крепость, моя семья — моя обитель».
 

Что было сделано:
 

  1. Отрисовали макет дома в Ai, импортировали в Ps;
  2. Отрисовали свет и тень;
  3. Изучили техническую документацию хранения колёс в зимний период времени;
  4. В соответствие с п. 3 расположили колёса в макете;
  5. Проработали свет и тень, вписали колёса в окружающее их пространство;
  6. Доработали декоративные элементы макета — добавили шторку с элементом фирменного цвета для узнаваемости;
  7. Провели общую цветокоррекцию, выровняли все слои;
  8. Придумали тематический заголовок;
  9. Выровняли все элементы по модульной сетке.
     

Выслали получившийся макет заказчику:
 

 
2017   Toyota   дизайн

Визитки за 150 рублей! Всем!

Визитка — прямоугольник размером 90 х 50 мм (евростандарт 85 x 55 мм), основной функцией которого является передача своих деловых контактов кому-либо. Следовательно, из внешнего вида визитки должно быть абсолютно понятно то, чем занимается компания/сотрудник.

Шрифты, логотип, отступы, интервалы — всё это и многое другое должно соответствовать фирменному стилю. В противном случае визитка не несёт в себе никакой представительской нагрузки.

Когда люди обращаются к визиткам? Когда хотят получить консультацию или что-либо заказать. Представьте, у директора 20 визиток компаний, предлагающих консалтинговые услуги. Уравновесим шансы — все, кто вручал визитки — приятные люди, оставляющие только хорошее впечатление. И как тут быть? Победит та консалтинговая компания, чья визитка окажется ближе, например на столе. Дизайн визитной карточки выполнен в соответствие с фирменным стилем, а бумага, на которой он исполнен, подобрана идеально. Кроме того, на визитке есть некая «плюшка», которая и заставила оставить прямоугольник размером 90 x 50 мм на столе. Самое главное, чтобы эта «плюшка» органично вписывалась в дизайн. Она может контрастировать, но никак не выходит за рамки общей картины.

Итак, для создания персональной визитки понадобится:

  1. Изучение дизайнером вашей айдентики (фирменного стиля);
  2. Ваше ТЗ из 3-4 предложений (чтобы вы хотели видеть на визитке, кроме стандартных ФИО, лого, etcetera?);

Что делает дизайнер и сколько?

  1. Изучает фирменный стиль (10-20 минут в зависимости от количества страниц);
  2. Делает 8-10 скетчей визитки, которые согласует с заказчиком и выбирает 3 скетча для mockup (2-4 часа);
  3. Создаёт 3 mockup’a, снова согласует с заказчиком и выбирает понравившийся вариант (1-2 часа);
  4. Дизайнер отрисовывает макет (1 час).

Итого в часах: ~6 часов на создание одной качественной персональной визитки (в идеальных условиях).

Вы всё ещё уверены, что визитка может стоить 150 рублей?
Если да, то могут дать контакты вот этих ребят:

2017   дизайн

Гамаши С Кашемир

В конце декабря на просторах Интернета прогремела шутка «Если есть ангелы виктории сикретс, значит где-то должны быть демоны кыштымского трикотажа», автором которой является кандидат исторических наук Александр Фокин. Вроде и смех, и грех, но в действительности почему-то местные трикотажные фабрики используют не неких мифических существ, а вполне реальных знаменитостей:

Эмма Уотсон
2017   дизайн