Проекты

Вид:

Дизайн интернет-магазина официального партнера Schneider Electric

Статус:
Дизайн готов
Ссылка:
Задача:
Разработать дизайн-проект интернет-магазина, включающий в себя главную страницу, каталог, карточку товара, корзину, страницу оформления заказа, всплывающие окна.
Решение:

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

#00AB4D
#42B4E6
#E83032
Font-family:Arial

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

Требование к главной странице: узкая шапка, чтобы после слайдера с банерами от самого бренда были на первом экране видны и товары (которых планируется быть всего на сайте порядка 30тыс) при этом в шапке нужно, чтобы сразу была вся основная информация: город, контактная информация (оба телефона, email и what's up), поиск по сайту, меню с определенными пунктами и пользовательское меню развернутое (это "Доставка и оплата", "Адреса шоурумов", "Возврат и обмен товаров", возможно еще какие-то пункты добавятся). Так же в шапке должны быть: личный кабинет, корзина, избранное и сравнить товары.

Разделы каталога должны быть крупнее чем серии, и они тоже должны быть сразу на главной странице. Обязательно наличие акций и новостей для сео. Остальные блоки на моё усмотрение. Поэтому мною был добавлен блок с информацией по доставке и самовывозу с преимуществами доставки и пунктами самовывоза. Расписала шаги заказа, объединив их с контактной информацией и формой "Перезвоните мне". А так же блок с преимуществами "Почему мы?".

В подвал мы вынесли контактную информацию и основные пункты каталога + полное пользовательское меню.

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

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

Каталог сделан в 2ух видах: товары плиткой и списком. Проработан фильтр, который находится справа. При выборе каких-либо пунктов фильтрация происходит не сразу (чтобы была возможность выбрать разные фильтры сразу), а после нажатия на всплывающей плашке "применить" под информацией о количестве найденных товаров. Предусмотрена сортировка по популярности/алфавиту и цене, выбор количества на странице. Для удобства разделы каталога из фильтра были вынесены на самый верх в виде картинок с подписями для быстрого перехода между разделами. Картинки все подбираются по возможности в бело-сером цвете, чтобы всё смотрелось лаконично и в едином стиле. Внизу на этой странице идет текст-описание раздела, необходимый для сео.

Помимо основной корзины должна быть возможность заказа в один клик (быстрого заказа). Так же для удобства мы сделали выпадающий список товаров в корзине при клике на иконку корзины в шапке. Чтобы всегда можно было посмотреть что там уже есть без перехода в саму корзину.

Так же в мою задачу входило сделать макет одно всплывающего окна для примера.

Оформление заказа состоит из 3ех этапов:

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

2) Доставка в зависимости от заказа доставки или самовывоза: сразу наглядно видны сроки.

3) Оплата, где можно выбрать способ и ввести промокод для скидки.

Другие страницы:
Отзыв о проделанной работе:
Анна, хотим Вас поблагодарить за работу над дизайном нашего интернет-магазина 220se.ru*. Работать с Вами было очень комфортно: Вы учли все наши требования, пожелания и правки. А так же мы очень рады предложенным Вами идеям для удобства пользователей. Осталось дело за малым: реализовать все задумки. Интересно посмотреть как новый сайт отразится на статистике и будет принят нашими клиентами. Спасибо за скорость и качество!
*Разработка ведется на адресе se.220city.ru

Имиджевое видео для интернет-магазина 220city

Статус:
Завершен
Задача:
Подобрать подходящие видео на стоках или сайтах партнеров и сделать короткий имиджевый видеоролик для интернет-магазина электрооборудования 220city. Акцент сделать на том, что это официальный партнер топовых брендов электрооборудования, магазин продает только оригинальную качественную продукцию. Видео должно привлечь новых покупателей, так как в этом магазине можно найти любую качественную электрику для дома и офиса.
Решение:

В первой части ролика показана работа инженеров и дизайнеров над созданием качественного и надежного электрооборудования, без которого сложно представить нашу современную жизнь. Плавно переходим к домам потребителей, где все так или иначе пользуются техникой. Во второй части: где это всё можно купить? online в гипермаркете электрооборудования 220city, где представлены самые известные бренды (перечислены главные из них).

Цветокоррекция с переходом от холодных кадров к теплым, когда мы переходим от технологий к людям. Озвучка с субтитрами (субтитры и эффектное появление логотипа сделаны в After Effects), спокойная фоновая музыка.

Отзыв о проделанной работе:
Анна предложила нам сделать имиджевое видео для возможности запуска рекламы в видеоформате.
Важным является тот момент, что мы хотели обойтись без съемок и это получилось! Ролик прекрасно отражает направление нашей деятельности по продаже качественных электроустановочных изделий, а так же то, что мы являемся официальным дистрибьюторами крупных производителей.

Курс массажа по авторской методике Олега Бочкарева

Статус:
Проект завершен
Ссылка:
Задача:
Нужен продающий лендинг для авторского курса массажа с личным кабинетом с видео-уроками, к которому после покупки пользователь получает доступ.
Решение:

С помощью наводящих вопросов мы определили какие блоки мы хотим видеть на нашем лендинге. 

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

#F7DED8
#E0EEE9
#DE907F
#6A5250
#42645C
Font-family:Futura PT

Особое внимание уделено мобильной версии сайта, так как основной трафик регистрирующихся ожидается из Instagram

Другие страницы:

ТехноРемонт. Механизированная штукатурка в Москве и Московской области

Статус:
Проект завершен
Ссылка:
Задача:
Необходим сайт в кратчайшие сроки по механизированной штукатурке строго по ТЗ.
Решение:

В этом проекте было очень точно составленное ТЗ, заказчик четко представлял от и до что именно он хочет видеть на сайте, самостоятельно проанализировав конкурентов и выделив их сильные и слабые стороны. Мне лишь оставалось оформить всё в собственном едином. 

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

#FDCC56
#F28425
#F32B34
#384349
Font-family:Open Sans

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

Другие страницы:

Дизайн и разработка сайта для девушки-художницы "Портреты на заказ"

Статус:
Дизайн 1ого этапа готов, идет разработка + продумывание дизайна 2ого этапа: интернет-магазина готовых картин
Задача:
Создать выгодно выделяющийся внешне сайт, при первом же взгляде на который был бы виден уникальный стиль художницы, в котором она работает. Сделать акцент на удобстве при заказе портрета, простоте и прозрачности схемы совместной работы над картинами. Необходима галерея работ и магазин готовых картин.
Решение:

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

#7D7D7D
#353535
#ffffff
Font-family:Brush Font для заголовков Helvetica для основного текста

Сайт для личного бренда, поэтому фоновые картинки в разделах "контакты" и "доставка и оплата" - фотографии художницы, особенно учитывая тот факт, что часто она передает работы лично - её будет легко узнать. Отзывы от клиентов со ссылками на источники и авторов для повышения доверия к сотрудничеству. Уделили особое внимание страницы "Этапы заказа", где подробно описана схема совместной работы над портретом в 8 шагах. Будет присутствовать интернет-магазин готовых работ. Удобная галерея всех работ с фильтрами. Выделили 4 направления её деятельности (портрет, открытка, диджитал-портрет и готовые картины), и в зависимости от направления расписали техники и форматы, которые формируют итоговую цену.

Было принято проводить работу над сайтом в несколько этапов: 

1) многостраничный сайт-визитка

2) добавление интернет-магазина

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

Другие страницы:
Отзыв о проделанной работе:
Анна профессионал своего дела. Нужен был уникальный сайт-визитка, который полностью соответствует всем моим многочисленным требованиям - я его и получила! Все изменения и корректировки вносились в режиме он-лайн. С первого раза попали в точку с дизайном: все детали максимально соответствуют концепции моей деятельности. Интересно представлены услуги, сама бы такое не придумала. Очень доходчиво всё объясняет, терпеливо относится к людям, ничего не понимающим в этом деле. С нетерпением жду завершения разработки, скорее хочется запустить его в работу. Рекомендую!

Оформление гайда по базовому гардеробу

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

Для заглавной страницы был выбран нежный серо-голубой цвет, для внутренних - белый с едва заметным оттенком. Цвет текста - темный сине-серый.

#C3C9D7
#FDFEFF
#373A50
Font-family:Fira Sans

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

Другие страницы:
Отзыв о проделанной работе:
Хотелось бы выразить огромную благодарность Вам Анна за проделанный труд - оформление моего Гайда по базовому гардеробу. Была проделана немалая работа. Особо хотелось бы подчеркнуть, что больше всего удивила быстрая скорость выполнения заказа. Я даже не ожидала, что это может быть так быстро. Важно, что при этом не пострадало качество оформления. Вами были полностью учтены мои предпочтения по цветам оформления, тексту, подачи в целом. Все грамотно и качественно. Это очень ценно. Все коррективы вносились без промедления. В общем я вас благодарю от всей души. И не устану повторять слова благодарности. Вы - отличный специалист. Обязательно буду рекомендовать вам знакомым и друзьям!

Интернет-магазин клеевых страз crystalclear.su

Статус:
В работе
Задача:
Сделать интернет-магазин клеевых страз и стекляруса. Целевая аудитория: ателье по пошиву платьев для спортивных танцев. Прошлый опыт в разработке не привел к должному результату так как не был доведен до конца - https://crystalclear.su
Решение:

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

  • о компании Crystal Clear и преимуществе их кристаллов;
  • 2 раздела (стразы и стеклярус);
  • виды оплаты и варианты доставки (при желании изучить детали можно провалиться в соответствующий раздел);
  • блок "на связи" с контактами
  • особое внимание уделено instagram - так как сейчас в основном продажи идут через эту соцсеть, поэтому не стала ограничиваться ссылкой и сделала целый блок, где будут выводиться 4 самых актуальных и интересных поста
  • в подвале помимо стандартной информации, пользовательского соглашения и контактов продублировано меню для удобной навигации.

Классический вариант был предоставлен в 9 макетах главной с лишь небольшими отличиями. Отличается подвал и внешний вид блока с товарами. Здесь сделан акцент на простоте и удобстве в выборе. По 3 товара в каждом разделе уже есть сразу на главной. Ничто не отвлекает от выбора и быстрой работы по поиску необходимого декора для костюмов.

Черная полоса вверху - для быстрой навигации между другими проектами компании: слева - их главный сайт, справа - будут 3 логотипа их подпроектов.

Для заказчика выбор оказался сложным, так как понравились оба варианта. 

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

Другие страницы:

Новогоднее фуд-видео о приготовлении козуль и пряничного домика

Статус:
Завершен
Задача:
Снять и смонтировать короткое фуд-видео о семейной традиции печь на Новый год козули.
Решение:

Составлен план по съемке видео по кадрам с продуманными переходами и с подбором референсов. Проведена съемка на телефон процесса приготовления традиционных рождественских Архангельских пряников - козуль: от приготовления теста до выпечки и росписи глазурью. В процессе было снято 2 таймлапса. Из источников света: кольцевая лампа. Монтаж на телефоне в программе VN. Сочная контрастная цветокоррекция и соответствующий видео саунд-дизайн.

Другие страницы:

Видео для блога "4 меня"

Статус:
Завершен
Задача:
Смонтировать 4 разных действия в одном кадре.
Решение:

В Adobe Premiere накладываются 4 видео, снятые с одного ракурса на штатив, с помощью маски вырезаются необходимые области для создания эффекта, что человек расчетверился и делает задания одновременно. Для разнообразия добавлены тематические стикеры.

Сайт индивидуального пошива нижнего белья Svetlar lace

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

Мне виделся сайт в нежных цветах с "кружевными" акцентами, так как основа коллекций - изделия из кружева. 

#C2B3B1
#EEE9E8
#7D7D7D
Font-family:Raleway

Главная страница в виде лендинга, где

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

второй блок - информация о мастере, всё-таки это сайт личного бренда и она осуществляет полное взаимодействие с клиентами.

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

четвертый блок - способы связи и контактная информация

четвертый блок - скидка за отзыв в соцсетях для повышения узнаваемости бренда и рекламы.

пятый блок - популярные модели с возможностью купить или заказать.

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

седьмой блок - блок с отзывами от клиентов

Отзыв о проделанной работе:
Анечка, спасибо тебе огромное! С тобой очень легко работать. Я даже не ожидала, что сайт окажется таким крутым по дизайну, и удобству работы на нем. Он просто бомбический, а самое главное: помощь даже в маленьких нюансах, всегда на связи. Я просто безумно рада, что у меня теперь есть такой крутой сайт! И честно сказать была не готова к настолько быстрым срокам его готовности.

Сайт "Курс по сну" с нуля. Продается

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

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

#2A5E8E
#2266A5
#FFA251
Font-family:Futura PT

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

Есть блок с отзывами; форматы проведения; результаты курса; форма обратной связи и непосредственно сама покупка тарифов

Сайт сделан на конструкторе Tilda. В случае покупки будет передан на Ваш аккаунт. Также возможен вариант размещения на Вашем хостинге с удобной панелью управления.

Видео для утренней сторис.

Статус:
Завершен
Задача:
Снять и смонтировать завтрак с сырниками и горячим кофе.
Решение:

Съемка в стиле Daniel Schiffer с "безумными переходами". Монтаж на телефоне в программе VN. Сочная контрастная цветокоррекция и соответствующий видео саунд-дизайн.

Иконки электротехнических изделий

Статус:
Завершен
Задача:
Создать иконки для разделов электротехнических изделий.
Решение:

Разработаны векторные иконки для следующих разделов: 

Звонки и домофоны
Разъемы, вилки, удлинители
Инструменты
Оборудование для автоматизации
Шкафы, щиты, боксы
Измерительные приборы
Розетки и выключатели
Трансформаторы и источники питания
Кабель-каналы
Системы передачи данных
Кабельные лотки
Шинопровод
Монтажные коробки и аксессуары
Низковольтное оборудование

Трекер привычек

Статус:
Завершен
Задача:
Создать личный трекер привычек для девушки.

Новогодняя поздравительная открытка для однокурсников

Статус:
Завершен
Задача:
Сделать веселую поздравительную открытку для однокурсников для поднятия настроения на Новый год.

Календарь на 2021 год с выходными днями

Статус:
Завершен
Отправить заявку