Search
Write a publication
Pull to refresh
26
0
Антон @Varhal

Design Lead

Send message

Серьезное проектирование серьезного магазина. Часть 2. Модули интернет-магазина

Reading time15 min
Views80K
В прошлый раз мы написали довольно популярную статью: «Серьезное проектирование серьезного магазина. Часть 1. Исследования», эта статья её логическое продолжение. В этой статье и в последующих мы опишем почти 60 функциональных модулей топовых интернет-магазинов мира, а также подробно разберем интерфейс многих страниц.

Главная страница интрнет-магазина в axure
Читать дальше →

Как я купил wi-fi весы, уволился с работы и начал жить

Reading time6 min
Views210K
image

Stop fucking procrastinating and do some fucking work!


Это не то, что я услышал от своего начальника (хотя иногда вполне заслуживал такого обращения), а название одной из сотен книг в каталоге «Амазона», посвященной борьбе с прокрастинацией.
Читать дальше →

Самое интересное из мира веб-дизайна. Дайджест Genue №1, февраль 2014

Reading time4 min
Views26K
Рады представить первый выпуск «Самого интересного из мира веб-дизайна». Мы постараемся делать такие выпуски регулярно. В сегодняшнем выпуске мы поговорим про дизайн как таковой: 1) Что должен знать дизайнер об отступах в заголовках; 2) Как иконка прелоадера влияет на наше отношение к сервису; 3) Азы адаптивного дизайна; 4) Использование «Photoshop Generator» для создания прототипов; 5) Руководство по стилю от Yelp. Расскажем о новых интересных и красивых сервисах: 1) Генератор случайных пользователей; 2) Сервис Peek. Видео-отзыв о сайте от реального человека; 3) Recordit.co. Сервис для записи скринкастов; 4) Peekcalendar. Карманный календарь. Покажем, что нового, у всем известных ребят: 1) Iconfinder. Версия 5.0; 2) Новый Ted.com 2.0




Что должен знать дизайнер об отступах в заголовках


image

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

http://artgorbunov.ru/bb/soviet/20140224/


Читать дальше →

Полностью анонимный блог

Reading time2 min
Views65K
image
В качестве развлечения, а также упражнения в безопасности и анонимности в наше время, автор блога Untraceable представил свой блог, который, как он считает, абсолютно анонимный — такой, что по нему нельзя вычислить автора блога.

Итак, как создать анонимный блог.
Читать дальше →

Командная работа над интерфейсами

Reading time8 min
Views17K
За последние шесть лет, пока я строил команду по проектированию интерфейсов, начав с самостоятельной деятельности и закончив командой из 11 человек, я видел, насколько сильно дизайнерские исследования могут повлиять на развитие продукта. Раньше у нас было мало времени на опрос клиентов и тестирование удобства. В основном мы действовали спонтанно: слушали, что говорит техподдержка и переделывали всё на ходу.



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

В результате мы стали жить в мире зацикленных исследований как в фильме «День сурка», задавая одни и те же вопросы и редко используя то, что мы уже знаем.

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

А началось все с личного кризиса.
Читать дальше →

Программист получает инвестиции: наш опыт

Reading time7 min
Views17K
Не так давно мы прошли этап получения первых венчурных инвестиций, поэтому хотели бы поделиться опытом подготовки проекта к инвестициям. Раньше я рассказывал о появлении идеи и публиковал пошаговое руководство о том, что надо сделать перед поиском инвестиций.

image

Читать дальше →

Закрываем 2013 год

Reading time1 min
Views14K
Здравствуйте, дорогие друзья!
Вот во Владивостоке уже наступил Новый 2014 год, и, по традиции, хотелось бы закрыть уползающий змейкой 2013, который принес много интересного и полезного на страницы Хабрахабра.



Хочу предложить каждому написать ссылки на те новости, которые стали наиболее важными и полезными в уходящем году.
Читать дальше →

Снимаем постпродажный шок: короткий совет для интернет-магазинов

Reading time5 min
Views99K
Привет! Есть такая штука – постпродажный шок. Это когда человек купил что-то, отдал деньги, получил вещь в руки… и начинает лихорадочно думать, зачем он это сделал.

В крупных городах, где шоппинг развит, это не так актуально, как в регионах (где до кучи ещё и зарплаты несколько меньше). Поэтому у нас есть одна рекомендованная механика, которая помогает этот шок снимать.

Сейчас расскажу.
Читать дальше →

Серьезное проектирование серьезного магазина. Часть 1. Исследуем и продумываем функционал

Reading time19 min
Views129K
Не так давно я писал статью про проектирование больших сайтов на примере социальной сети со схожим названием: «Серьезное проектирование серьезных сайтов». Сегодня я хочу поговорить про одну из основных сфер нашей деятельности – электронную коммерции, а именно про проектирование интернет-магазинов.

Это цикл статей больше специалистов, значительно более углубленно, чем все мои прошлые статье в этой области. В статье я расскажу про крупнейшие интернет-магазины США, Китая, России и Украины, расскажу как маркетинг влияет на проектирование, покажу подробный Mind Map гипермаркета, опишу 57 основных модулей интернет-магазинов для внешней (покупательской) части и более 50 модулей для внутренней части (административной), покажу интерфейсы магазинов и еще много полезного.

Интернет-магазинами и технологиями продаж в Интернете лично я занимаюсь с далекого 2005 года. За годы работы мое мнение по этому вопросу сильно эволюционировало. Когда-то я думал, что интернет-магазин – это довольно простой сайт с точки зрения разработчика или маркетолога, мне казалось, что все магазины похожи друг на друга и достаточно один раз получить пул знаний, который потом можно будет использовать многие годы без особых изменений, ведь интернете-магазин – это только тип сайта для продажи товаров и на первый взгляд нет ничего сложного в том, чтобы разработать очередной магазин со схожим функционалом, но с другими товарами. На самом деле все значительно сложнее и чем больше я узнаю про интернет-магазины, тем больше понимаю, что в этом вопросе невозможно знать все, даже одна мелочь в интерфейсе может изменить прибыль магазина на тысячи долларов, а для больших игроков эта «мелочь» может стоить миллионы. Именно эта особенность электронной коммерции делает требования к сайтам и специалистам, которые их делают, безумно высокими. Чуть ниже я покажу много интересных цифр, которые докажут мое утверждение.

Ранее я уже писал статью про технологию проектирования больших сайтов, которая, кстати, имела очень большую популярность в русскоязычном и англоязычном сегменте Интернета: «Серьезное проектирование серьезных сайтов». Проектирование интернет-магазина хоть и имеет сходную последовательность действий, описанную мной в прошлой статье, но сама технология все таки сильно отличается, поэтому давайте рассмотрим это в мельчайших подробностях. По ходу статьи я буду ссылаться на свою прошлую, чтобы не повторяться, а в этой сделаю упор именно на различия.
Mind Map
Читать дальше →

Продающий дизайн интернет-магазина. Часть 3. Дизайн элементов

Reading time14 min
Views66K
Третья часть статьи из цикла «Продающий дизайн интернет-магазина». Для тех, кто пропустил первую и вторую, их можно прочитать тут: «Продающий дизайн интернет-магазина. Часть 1. Аналитика» и «Продающий дизайн интернет-магазина. Часть 2. Элементы интерфейса».

Страница товара


Попав на страницу товара, человек должен получить максимум информации о нем. Здесь не работает правило «краткость – сестра таланта». Так как мы имеем дело с онлайн магазином, то наш покупатель лишён возможности увидеть товар вживую, поэтому мы и должны предоставить ему максимум имеющейся у нас информации: детальное описание, технические характеристики, качественные фотографии, отзывы, видео или 3D-обзор. Отзывы для товаров, кстати, изобрел Амазон, внес социальность на сайт, сильно увеличив тем самым конверсию и продажи.

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

image
Читать дальше →

Почему 98% текстов на ваших сайтах не работают. Вообще. И как это починить

Reading time7 min
Views285K

Вот так люди видят вашу страницу

Привет!
Проблема вот в чём. Если зайти на практически любой сайт интернет-магазина или компании с услугами, вы встретите контент. Точнее — отвратительные тексты, которые писали, кажется, маркетологи, воспитанные сеошниками.

Разумеется, можно не делать, как они. Если работать по-умному, то вы поможете и читателям по жизни, и себе в продажах.

По моим примерным подсчётам (усреднение с ряда позиций), конверсии для нас выглядят так:
  • Только название и картинка — около 1,5%.
  • С описанием от производителя — чуть более 2%.
  • С описанием человека, который держал это в руках и знает правила — около 6%.

Ниже — рассказ про то, как мы доводили время на сайте от 3 минут сначала до 6:40, а потом до 20:48. Да-да, двадцати минут сорока восьми секунд для среднего посетителя. Честного среднего, с учётом отказов и по полной выборке.
Читать дальше →

Продающий дизайн интернет-магазина. Часть 2. Элементы интерфейса

Reading time7 min
Views74K
Вторая часть статьи из цикла «Продающий дизайн интернет-магазина». Для тех, кто пропустил первую, её можно прочитать тут: «Продающий дизайн интернет-магазина. Часть 1. Аналитика». Сегодня я расскажу про разные части интерфейсов магазинов, которые важны для конверсии и продаж. Постараюсь обозначить какие элементы должны быть в шапке и футере сайта, на главной странице, на странице каталога и многое другое.

Логотипы крупнейших интернет-магазинов
Читать дальше →

Дизайн сайта в Sketch.app (Mac OS). Часть 1: плагины и прототип

Reading time4 min
Views55K
Радует, что все больше дизайнеров посматривают в сторону от Адоби в поисках инструментов поудобнее, полегче, попроще и подешевле. И выбирать есть что. Сегодня я расскажу про свой процесс создания дизайна сайта в Sketch.app. Надеюсь, какие-то мысли вы позаимствуете у меня, что-то никогда не станете делать так же, а до чего-то придете своим путем. Оставайтесь с нами.
Читать дальше →

Продающий дизайн интернет-магазина. Часть 1. Аналитика

Reading time13 min
Views148K
Сегодня я хочу поговорить про дизайн интернет-магазина и подойти к этому вопросу основательно. В статье не будут затронуты другие аспекты связанные с интернет-магазинами, только дизайн. Эта первая часть статьи, она больше про аналитику и общие моменты, которые прорабатываются еще до интерфейсов, а вторая статья будет больше про сами интерфейсы.

Это первая статья. Всего их будет 3.

image

Читать дальше →

Вечный торт: интервью с Денисом Крючковым, основателем Хабрахабра

Reading time9 min
Views83K


Есть минимум две причины, по которым гордая редакция твоей любимой «айти-мурзилки» решила пообщаться с создателем Хабрахабра об истории этого уникального проекта. С одной стороны, конечно, это не имеющая прямых аналогов площадка, сформировавшая вокруг себя огромную аудиторию IT-профессионалов. А с другой — один из немногих успешных примеров того самого «издания нового поколения», которого все ждут с тех самых пор, как придумали слово «блог». Почему же гики смогли создать для себя медиа, которое не могут сделать обычные люди?
Читать целиком

Электронная торговля в Universal Analytics

Reading time3 min
Views36K
image
На Хабре уже писали (1,2) про Universal Analytics от Google.
Электронная торговля и отслеживание событий на сайте — это главные функции аналитиков интернет-магазинов и компаний, которые отслеживают продажу товаров и услуг. В данном топике мы рассмотрим их настройку для Universal Analytics.
Читать дальше →

Настраиваем электронную коммерцию в Google Analytics

Reading time4 min
Views11K


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

Отчеты электронной торговли


Какую же информацию можно извлечь, настроив «Электронную торговлю» в Google Analytics. Для этого рассмотрим возможные типы отчетов.

Эффективность продукта


(Конверсии – Электронная торговля – Эффективность продукта)

Модуль «Электронной торговли» позволяет оценивать эффективность продуктов интернет-магазина:
  • Количество купленных товаров и полученный доход
  • Популярность товаров
  • Количество покупок за определенный период времени


Читать дальше →

12 основных принципов NUI дизайна

Reading time2 min
Views8.7K
Доброго времени суток, хабравчане. Хочу поделиться с вами ответом Дэна Сэйфера c Quora на вопрос об основных принципах натурального пользовательского интерфейса и очень полезным сайтом Design Principles FTW.

Основные принципы NUI дизайна


1. Дизайн для пальцев, не для курсора
Сенсорные элементы должны быть больше десктопных: 10-14 мм для пальцев, 8-10 для курсора.

2. Помните о физиологии и кинезиологии
Не заставляйте пользователей масштабировать и совершать повторные действия.

3. Никаких рук гориллы
Люди не должны выполнять множество задач с вытянутыми руками в течении длительного времени (калибровка, QR ридеры, сканеры и др). Извиняюсь за столь узкий момент.

4. Охват экрана
Совершая какие-либо жесты пальцами руки, в которой находится устройство, пользователь сам себе загораживает экран. Старайтесь размещать необходимые элементы управления на видном месте.

5. Знайте технологии
Понимание возможностей сенсора или камеры позволяет определить какие жесты вы можете спроектировать.
Читать дальше →

HTML Academy, Хабр и краудфандинг

Reading time3 min
Views90K
HTML Academy — это интерактивные онлайн-курсы по HTML и CSS. Проект существует уже более года, за который мы создали более 15 курсов, большая часть из которых бесплатна. Всё это время работа велась на чистом энтузиазме, однако, сейчас уже нужно выходить на новый уровень, чтобы делать курсы чаще, круче и полезнее. Для этого есть много путей, и один из них — народное финансирование.

Немного об HTML Academy


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

Практическое задание
Читать дальше →

Создаём своё расширение для Google Chrome

Reading time5 min
Views229K
На хабре уже есть несколько статей о создании расширений для хрома, поделюсь своим опытом, затронув основные вещи и места, в которых у меня возникли трудности.
Что понадобится для создания расширения в двух словах:
1) Базовые знания Javascript
2) Базовые знания HTML
3) 5$

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

Information

Rating
Does not participate
Location
Запорожье, Запорожская обл., Украина
Date of birth
Registered
Activity