Блог Тани Соколовской: posts tagged Daniel Lesden

Сделала новый логотип музыканта Daniel Lesden

Sat, 13 Jan 2018 19:55:24 +0100

Задача
Обновить логотип, при этом сохранить узнаваемость.

Так выглядел старый логотип. Работу выполнил сербский дизайнер Nebojsa Nadj в 2012 году

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

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

В имени есть вторая буква “D”, сразу пробую вставить знак и на ее место, при этом обрезаю хвостик-засечку:

Сейчас “D” слишком широкая в сравнении с остальными буквами. Поправляю это:

Также смягчаю хвостик и делаю его чуть короче:

Смотрю на результат:

Экспериментирую с пробелами в буквах:

Добавляю лигатуру и пробелы в другие буквы:

Собираю вертикальный вариант:

Слова не совпадают по ширине — плохо. Добавляю горизонтальные штрихи букве “I”, удлиняю горизонтальный штрих “L”:

Так мне не нравится. “Расширяю” букву “A”:

Выравниваю пробелы в буквах и беру “E” с хвостиком, так как без него образуется дыра между “LE”:

Широкая “A” решила проблему с выравниванием

Горизонтальный вариант тоже выглядит отлично

Окрашиваю лого в фирменный оранжевый цвет и отправляю клиенту:

Работа принята :-)

Дизайн psytranceguide.ru

Mon, 07 Aug 2017 20:08:36 +0100

Задача
Музыкант Daniel Lesden пришел с идеей сделать небольшой гайд по пситранс-музыке и попросил помочь с оформлением. Помогла!
psytranceguide.com

«Пситранс-гайд» — сайт с обзорами основных подстилей пситранса. Там можно почитать про каждый стиль, послушать примеры, узнать типичный темп. Такой вот образовательно-развлекательный ресурс.

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

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

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

Цвета подобрала темные, но с яркими насыщенными заголовками, что отлично вписывается в мир пситранса.

Сайт адаптирован и для мобильных устройств:

Участники проекта

Дизайнер
Таня Соколовская

Верстальщик
Даниил Соколовский

Обновление сайта daniellesden.com

Thu, 16 Jun 2016 19:16:35 +0100

Задача
Адаптировать сайт под любые экраны.
www.daniellesden.com

В ноябре прошлого года вышла третья версия сайта музыканта и диджея Дэниела Лэсдена. Это было большое обновление, в котором мы с командой пересмотрели структуру и обновили стиль всех страниц сайта.

Первая версия
Вторая версия
Третья версия
Адаптивная версия

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

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

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

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

Изначальный дизайн раздела в виде таймлайна

Сначала мы думали сделать на странице поиск, но это решение не подходило — часто новые пользователи еще не знают, что искать, поэтому им нужно помочь.

Разбиваем все советы по темам: написание музыки, диджеинг, менеджмент, маркетинг, бизнес.

Но по какому принцицу выводить советы — по алфавиту, по дате? И самое главаное — поможет ли это новым пользователям? И не навредит ли постоянным читателям? Направление с группировкой нам кажется верной, но над реализацией продолжаем думать.

Размышляем:

— А что если в группировках по темам выводить не все советы, а только важные по усмотрению автора? И показать их в красивой журнальной вёрстке с крупными картинками?

— И как это поможет?

— Очень просто: так мы поможем новым пользователям сориентироваться в рубрике. Вместо того, чтобы листать десятки, а скоро и сотни советов, мы как бы говорим «вот, начни читать с этого». Сами статьи внутри связаны тегами и ссылками, так что если пользователю понравится, он пойдет читать дальше.

— А где будут жить остальные статьи, помимо этих важных?

— Все остальные советы будут снизу в ленте, с этим без изменений.

— Получается, что постоянным читателям придется каждый раз прокручивать страницу вниз к этой ленте, чтобы узнать, вышли ли новые советы?

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

Звучит здорово. Приступаем к реализации:

Собираем макет предложенной идеи

Смотрим, оцениваем и продолжаем рассуждать:

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

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

— Это как?

— А вот так:

Анимация подгрузки помогает расставить акценты внимания

Это решение и вошло в финальную версию сайта.

Участники проекта

Ведущий дизайнер
Таня Соколовская

Дизайнер и верстальщик
Даниил Соколовский

Разработчик
Максим Сильнов

Третья версия сайта www.daniellesden.com

Wed, 25 Nov 2015 19:03:09 +0100

Задача
Освежить и улучшить все разделы сайта.
www.daniellesden.com

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

Первая версия
Вторая версия
Третья версия
Адаптивная версия

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

А еще верхнее меню на сайте теперь плавно скрывается при прокрутке страниц вниз, и также плавно появляется при прокрутке вверх. Кайф! Попробуйте сами.

Участники проекта

Ведущий дизайнер
Таня Соколовская

Дизайнер
Даниил Соколовский

Разработчик и верстальщик
Максим Сильнов

Вторая версия сайта www.daniellesden.com

Wed, 25 Mar 2015 10:55:52 +0100

Задача
Доработать все разделы сайта и перенести сайт на новый движок.
www.daniellesden.com

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

Первая версия
Вторая версия
Третья версия
Адаптивная версия

На страницах музыкальных релизов появились заметные кнопки «call-to-action» — кнопки, призывающие к действию

Еще здесь появились вкладки: пресса, отзывы и похожие материалы

Цитаты из прессы прямо на странице музыкального релиза

Отзывы известных музыкантов

Материалы из этой категории, например, ремиксы

Главная страница радио программы также получила обновление

На страницах миксов теперь привлекательные изображения с параллаксом

Фотоальбомы — новый раздел на сайте. На мобильных телефонах тоже прекрасно работает и смотрится!

Раздел для прессы теперь можно фильтровать по типам материалов: обзоры, интервью и статьи

Интересная страница «404»: набранные параметры 404 на дисплее миди-контроллера и надпись в духе Звездных Войн :-)

Участники проекта

Ведущий дизайнер
Таня Соколовская

Дизайнер
Даниил Соколовский

Разработчик и верстальщик
Максим Сильнов

Разработка сайта музыканта Дэниела Лэсдена

Tue, 26 Nov 2013 19:47:04 +0100

Задача
Разработать сайт музыканта.
daniellesden.com

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

Первая версия
Вторая версия
Третья версия
Адаптивная версия

Еще сделала космические промо-страницы альбома артиста.

Участники проекта

Ведущий дизайнер
Таня Соколовская

Дизайнер
Даниил Соколовский

Руководитель команды разработчиков
Станислав Мишин