Слышал, что кризис — время для проверки новых идей. Вот и проверю.

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

Радикально эту проблему решают стоки — там моментально и недорого. Но по пути они теряют качество и уникальность.

Я поискал что-то между этими двумя полюсами. И придумал онлайн-бутик с готовыми логотипами, которые продаются в одном экземпляре и дорабатываются мною же под конкретного клиента.

Если вы или ваши знакомые искали, где бы заказать логотип, то вот ещё один способ решить эту задачу — pre-logo.com.

Сейчас в бутик выложено 15 логотипов, но это не все. Заготовок у меня раза в 2 больше и я продолжаю придумывать новые, поэтому, если вы не нашли нужное, смело пишите на go@pre‑logo.comе.

В следующий раз расскажу о фичах. А пока задавайте любые вопросы о проекте :—)

Моя супруга Полина делает паттерны. Два года она рисовала по картинке в день. И вот сейчас у неё больше 67 тысяч подписчиков и первые клиенты с мировыми именами. Пришло время сделать любимой сайт.

Художественную задачу я видел одну — передать непрерывность узоров и полное заполнение формата. Поэтому отказался от однородного фона, состыковал изображения заподлицо, и размыл фон под текстом.

Логотип сделали из Полиного росчерка. Такой логотип просил нейтрального шрифта, и это стало следующий задачей — найти незаметную антикву, которая подчеркнула бы изящество работ, но не оттенила логотип. Сработал Таймс Нью Роман. Этот системные шрифты настолько часто встречается, что перестал обращать на себя внимание, но от этого он не перестал быть хорошим шрифтом. Дополнительный плюс — бесплатность. Устройство современных шрифтовых лицензий всё ещё ад.

Макет за 20 минут дал понять, что такой сайт мне по силам без Редимага, Карго и прочего. А в процессе стало понятно, что внутри ХТМЛа удобно организовать шаблонные блоки.

Блоки занимают всю ширину. У высоты пять отношений к ширине: 1:1, 1:2, 1:3, 2:3 и 1:4. Внутри блоки могут делиться на 2, 3 или 4 части. Вложенные блоки могут перестраиваться на телефоне в колонку или оставаться строкой.

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

Адрес — polinaoshu.com (осторожно: красивые, но тяжёлые картинки).

В следующих версиях:

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

P. S. Приходите ко мне за дизайном сайтов и интерфейсов, и к Полине — за паттернами.

Во время основной работы над сайтом Туннельтеха часа два обсуждали, как устроить языковые версии: отдельные текстовые файлы, чтобы переводчикам было удобнее или хранение всех языков в теле документа и выгрузка в таблицу для переводчиков. Я боялся, что работать с файлами, которые внутри хранят текст на всех языках, будет неудобно. А Толя объяснял, что так проще найти и исправить ошибку, а неудобно работать с длинным файлом будет единоразовым. В итоге он придумал теги, с помощью которых шаблонизатор на Питоне собирал отдельные языковые страницы из одного ХТМЛ-родителя. Шаблонизатор позволяет хранить внутри тегов не только текст, но и ХТМЛ. Этим пользуемся, когда для разных языков нужна разная вёрстка. В английской версии метры и футы, в остальных — только метры:

Правила у тегов простые:

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

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

Скриншоты двух страниц, если лень идти на сайт:

Когда говорю близким, что работаю в компании, которая производит аэродинамические трубы, они спрашивают, зачем компании дизайнер. Или уточняют, умею ли я проектировать трубы. Теперь могу немного проиллюстрировать ответ, показав обновлённый сайт компании — tunneltech.eu.

Чтобы рассказать клиентам, как всё работает, вник в технологии и экономику компании. Без предшествующих 3,5 месяцев работы над интерфейсами, рассказ вышел бы не таким глубоким, а времени на разработку сайта ушло больше.

Только мы наглядно объясняем разницы одно- и двухконтурной трубы:

Для каждой части трубы, даём схему, которая показывает положение в обоих конфигурациях:

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

Собрали таблицу с этапами запуска трубы, объяснив, кто что делает:

Хотели шаблонизировать вёрстку, чтобы новые материалы требовали минимум усилий. Ещё хотели донести кучи информации, часто технической, на больших и малых устройствах и найти технологичный и в меру модный характер. Как решение — сухая, местами топорная вёрстка, без ярких деталей, которая даёт иллюстрациям и прочей графике работать. Текущая аскетичность оставляет простор для новых форматов и выделений. Когда вёрстка была готова, пересобирал 3-4 этажа по мере получения материалов, не отвлекаясь на графредактор и не отвлекая разработчиков. Так убедился, что шаблоны работают.

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

Кайф из описания флагманской трубы:

На странице о моделях сразу даём сравнительную таблицу:

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

Идея ссылаться на что-то внутри страницы прекрасная, но иконка выглядит недорешением. Почему не менять УРЛ страницы динамически, чтобы пользователь всегда копировал путь к текущему этажу? Ссылаться на всю страницу нужно куда реже, чем на её части. Так и сделали. Теперь сайт будет и витриной, и внутренним инструментом — на его части будут ссылаться при объяснении деталей клиенту.

В этом проекте я побыл продуктовым дизайнером. Придумывал, проектировал, иллюстрировал, утверждал у артдира, писал черновики, редактировал немного, помогал менеджеру и разработчику, курировал съёмку фотографий и разработку 3Д-визуализаций, писал и переписывал код.

Планировали сделать за 3 месяца без мобильной версии, получилось за 6 с мобильной.

Спасибо Анатолию, Ксении, Самату, Роману и Ивану!