








Дизайн лендингов
Петр Петипак обратился с задачей обновить дизайна сайта. Предыдущий вариант был собран на коленке и уже не подходил под солидность бренда «Магия Геткурса».
Ко мне обратилась студия Inky. У них появилась проблема — нужно разработать дизайн сайта портфолио. Все работы лежат либо в телеграфе, либо в фигме, либо просто скидываются ссылками в чате — несолидно.
Создать дизайн сайта на основании описания и пожеланий клиента, кратко и эффектно рассказать о студии.
Главная страница
Было приятно поработать со специалистом такого уровня.
Перед стартом работ обсудили большую часть нюансов, после чего Даниил по шагам расписал этапы работ, по которым легко отслеживать текущий прогресс дизайна сайта.
Это круто, так как сразу становится понятно, что уже было сделано и что осталось, а также в конце проекта у вас не возникнет неопределенность.
Порадовало общение, за время которого ответы на любые вопросы предоставлялись быстро, насколько это вообще возможно.
Если вам нужна четкость в работе над вашим проектом — смело обращайтесь к Даниилу!
Еще благодарю за пак для соц. сетей! Круто, что дал больше, чем договаривались изначально.
Школа Animation School запускает поддержку начинающих специалистов по анимации. Не знаешь как решить проблему → можно просто спросить у специалистов в индустрии.
Разработать сайт из 6 блоков в стилистике сайта. Клиент предоставил готовые цвета, структуру сайта и изображение персонажа школы.
У клиента было мало времени, всего 7 дней. Главная задача — успеть к сроку, не проседая в качестве.
Разработали дизайн лендинга из 6 блоков и сверстали на тильде за неделю. Добавили анимации, сделали мобильную версию, подключили домен и запустили в срок
Remake — продукт для готового оформления GetCourse. Команда увидела, что школы заказывают одно и тоже и решила сделать шаблон, который можно поставить за 3 дня. Помогли 24 школам преобразить свои личные кабинеты на GetCourse.
Обновить сайт для продукта Remake — готового оформления для школ на Геткурсе. Старый сайт не показывал продукт достаточно хорошо и у пользователей оставалась куча вопросов.
Лиды не понимали продукт. Приходилось делать отдельные презентации и объяснять на созвонах. Некоторые не понимали, что можно заказать уникальный дизайн и уходили к конкурентам.
Начали составлять структуру исходя из анализа лидов и их вопросов. Все, что волновало пользователей — теперь на сайте. Раньше пользователи спрашивали о количестве страниц оформления, узнавали как устаналивается шаблон, спрашивали про уникальное оформление. Теперь все ответы на вопросы содержатся на сайте.
В предыдущих версиях сайта текст был прописан неверно. Он был слишком банальным, не затрагивал боли пользователей.
Например в блоке преимуществ для владельцев «Оформление геткурса как отстройка конкурентов» понятна каждому владельцу. Это довольно понятная вещь и каждый из исполнителей может написать это на своем сайте.
Мы решили основываться на том, какие преимущества есть конкретно у продукта, не в целом почему оформление это хорошо, а почему нужно покупать именно этот продукт.
Продукт готового оформления не самый простой. Его сложно описать в двух словах и быстро закрыть все вопросы. Поэтому нужно было погрузить посетителя в продукт. Для этого мы выбрали такие фишки.
Цель: показать, что шаблон можно менять. Чуть поменял — добавил уникальности.
Что сделали: заскринили главные экраны школ-клиентов, вставили в фигму и записали гифку со сменой страниц.
Цель: показать, что сроки установки — не маркетиновая уловка, а реальность.
Что сделали: показали урок однго из основателей продукта. С объяснениями как ставить Ремейк видео занимает 16 минут. 3 дня на устанвоку становятся правдивее. В тексте использовали простоватую подачу. Словно берем сами себя «на слабо».
Цель: сделать так, чтобы отзывы читали. Не просто «сделали в срок, спасибо!» и не поэмы из 10-абзацев.
Что сделали: вычитали отзывы, взяли самое важное, вытащили факты и оформили крупно.
При создании сайта мы сделали приняли решение делать легкий дизайн, который сделает акцент не на себе, а на продукте, потому что главный персонаж сайта — продукт. Все остальное должно быть незаметными декорациями на фоне продукта.
Дизайн сайта выделяет все самое важное и оставляет за скобками пространственные рассуждения и хваствоство. Сайт рассказыает о продукте просто и по делу. Если отзыв — то не 5 абзацев текста, а факты.
Каждый абзац текста на сайте был продуман и находится на сайте по какой-то причине. Каждая обложка преимущества или деталей продукта раскрывает текст, помогает узнать больше.
У потенциальных клиентов есть возможность посмотреть на процесс установки. Ничего не скрывается в недрах команды — установка показана стразу на странице.
Дизайн сайта выполнен в нейтральном стиле, без сильных визуальных различий в блоках. Это позволит пересобирать внутренние страницы не переделывая дизайн.
Ниже я показал, как может выглядеть страница услуги уникального оформления. Копируем почти все блоки, перетасовываем, лишние удалям. Вуа-ля, новая страница услуги за 15 минут, собранная менеджером.
Получился стильный, современный сайт, который рассказывает о продукте, минимизируя вопросы потенциальных покупателей.
Сайт попал в галерею лучших сайтов, созданных на Тильде. Нахождение в галерее лучших сайтов на Тильде деет проекту дополнительный трафик. Только за первый день сайт посетили 283 человека, пришедшие с сайта madeontilda.
Ко мне обратился Александр Фирсов, основатель школы BlaBlaInvest. Он продает свой гайд, где рассказывает об инвестициях. Гайд называться «Метавселенским». Целевая аудитория 35+.
Текущий сайт не отражает безумности метавселенных, не дает нужного настроя. Хочется чтобы было бодро.
Нужно подобрать несколько концептов, которые подходят под метавселенную тему, тему Алисы и какой-то спойкойный вариант.
После дизайна заверстать на Тильде с анимацией.
Видео из сторис @danya_postnov
Концепты получились в разных стялях.
После дизайна мобильной версии мы не стали делать отдельно дизайн ПК версии, а решили сделать верстку на Тильде. ПК-версия получилась такой.
Я не одобрил такой варинант. Слева миньон болтался без дела совсем. Он не выглядывал как в мобилке. Справа объезьяна с фиолетовым облаком оттягивала все внимание. Верстка ушла на доработку.
Второй вариант был лушче, но тоже не подходил. В центре слишком все сбито в кучу, а по боком много свободного места. В итоге я придумал фишку — просто повернуть расположение изображений изображений по почасовой, чтобы уйти с центральной линии текста, кнопки и цены.
На выходе получился вот такой дизайн и я понял, что это то, что нужно.
Версталось все на Тильде с сложной и базовой анимацией.
Разработать промостаниц для сбора заявок на покупку или аренду приложений. Сайт помогает потенциальным покупателям ознакомиться с условиями и преимуществами компании.
Клиенту не понравилось, что предыдущий дизайнер разрабатывал дизайн с эмоджи. Надо было этого избежать. Сайт должен быть быть легким и стильным.
В верстке должна быть минимальная анимация, плавный скролл при клике в меню, кнопка наверх.
Клиент предоставил весь текст, нам оставалось только преобразовать его в дизайн. Посмотрели сайты конкурентов, подметили хорошие и не очень решения. Спросили у клиента, какие сайты им нравятся, а какие нет и начали работу.
Посмотрели референсы и начали строить стиль.
Когда я только начинал работать дизайнером, я отдавал готовый дизайн макета за пару дней до дедлайна. Это опасно, потому что времени на правки мало. А шанс того, что клиенту не понравится какой-то блок или весь макет — велик.
Сейчас утверждение идет так:
Показали несколько варинтов первого блока, а потом несколько блоков, включая подвал. Клиент утвердил все с первого раза.
Я предлагал сверстать сайт на Тильде, но клиент попросил сделать статичную верстку на html, css, js, без использования конструкторов. В этом есть свои преимущества, дальнейшее масштабирование до wordpress или другой cms.
Клиент попросил сделать интересную анимацию на первом экране. параллакс-эффект. Чтобы при скролле. Максим — верстальщик, придумал сделать перемещение изначальных «пятен» градинета. Получилось легко и залипательно 🙂
https://dev-postnov.ru/sandbox/abcapps/
Обратился разработчик с задачей разработки лендинга портфолио. У него был старый сайт, но не подходил по дизайну и функциональности.
В планах сделать полноценный сайт с кейсами и блогом. Пообщавшись, мы пришли к выводу, что нам нужно сначала сделать лендинг, чтобы клиенты уже могли его найти.
После этого уже можно вторым этапом делать кейса, а третьим этапом блог.
Начали с лендинга. Его целевая аудитория по разработке — государственные организации. Нам не надо делать студийного проекта уровень, просто и со вкусом.
Также у клиента был ограниченный бюджет — 20 000₽. Я предложил только ПК версию и с ограничением в 6 блоков.
Разработал дизайн лендинга с основными секциями, которые дают понимание, что это за разработчик и что он может предложить.
Так как я сам часто нанимаю разработчников для своих проектов, я понимаю что нужно отразить, чтобы клиент мог принять решение о навыках разработчика.
Ко мне обратился Роман с задачей разработки лендинга и сбора фирменного стиля. Он сам создал дизайн текущего лендинга, но для нового лендинга захотел привлечь профессионала.
Ему также не нравилось, что инстаграм, геткурс и лендинг в разных стилях.
Нужно было сделать лёгкий и современный дизайн для женщин 35−50 лет. Не перегруженный, но эстетичный
Разработали прототип и дизайн лендинга на 15 секций. Определились с цветами и элементами для фирменного стиля.
Дизайн лендинга я делал для своего курса Notion Pro. Делать дизайн своим продуктам очень сложно — никто не подгоняет и не даёт правок. Можно растягивать проект до бесконечности.
Я решил флексить. Поставить себе срок 3 дня и сделать сайт. Этот дизайн лендинга удалось сделать за несколько часов.
Ко мне обратилась компания MethEd. Им нужно было создать дизайн лендинга для курса по вёрстке. Они запускали первый поток через несколько недель.
Нужно создать лёгкий и простой дизайн. Клиент не хотел следить за мной и контроллировать процесс. Договорились о фидбеке клиента на контрольных точках: пк-версия и мобильная-версия.
В сжатые сроки разработал дизайн лендинга в 2 разрешениях: пк и мобильный. Разработал UI-кит, дизайн модальных окон. Клиент остался доволен и планирует продложать работу над расширением объёма и функциональности сайта.
[изображение удалёно из-за наличия иконок компаний запрещенной в России организации Meta]
Аудио отзыв Максима Лескина, спикера курса.
Разработать лендинг по готовому прототипу. Дизайн должен быть в стиле минимализма. Информацию нужно показать просто, но со стилем.
Разработал дизайн лендинга в 3 разрешениях: компьютер, планшет, мобильный. Клиент остался доволен креативностью и стилем лендинга.
В сжатые сроки разработать дизайн лендинга для вебинара «Не как у всех: сложный свет для фотографов» по готовой структуре и текстам. Нужен был современный и креативный дизайн.
Разработал дизайн лендинга в 3 разрешениях. Уложился в сжатые сроки. Клиент остался доволен креативностью и стилем лендинга.
Клиент обратился ко мне за разработкой нового сайта. Планировался сайт на Wordpress с блогом и кейсами. Но для начала мы решили сделать лендинг.
Клиент быстро собрал лендинг с помощью шаблонных блоков и хотел обновить дизайн. Сделать его уникальным и по его видению.
Сделал дизайн лендинга для компании, которая занимается вывозом лома.
Компания вывозит лом металлов с дачных и городских участков. Помогает вывозить лом после разбора конструкций. Классно, что можно отправить фото и получить оценку дохода по фото.
Разработал прототип, компьютерную и мобильную версию дизайна. Лендинг вышел в 7 экранов. Стиль лендинга — строгий, как и сама компания: приезжают вовремя, не обманут с взвешиванием, уберут за собой.
Закончил дизайн лендинга для консультанта-нумеролога
Мила занимается нумерологией. Нумерология — наука о числах в вашей жизни. Она рассказывает и показывает, как числа влияют на вашу судьбу, счастье, карьеру, успехе в отношениях.
Лендинг получился мистическим, но в то же время легким и понятным — как и сама нумерология.
Работа на курсе по дизайну лендингов.
Машинка может ездить по бездорожью, продолжает ехать даже если перевернется. Можно менять подвеску. Разгоняется до 20 км/час.
Так как тематика детская, лендинг получился сочным и красочным. Разработал компьютерную и мобильную версию в 10 экранов. В итоговой версии лендинга будут анимированы летающие элементы, пульсирующие круги и блики на кнопках для повышения конверсии.