• Как сторимэп помогает не завязнуть в разработке нового продукта на годы

      «Додо Пицца» развивается в США. В середине 2016 года мы открыли доставку в Оксфорде и быстро поняли, что предпочтения клиентов в США и России отличаются. Американцы — индивидуалисты. Они привыкли, что можно собрать пиццу из любых ингредиентов: пусть даже бекон с шоколадным соусом. Поэтому нам надо было сделать такой функционал для американских Додо. Мы назвали проект «Своя пицца».


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


      Чтобы разобраться, мы использовали сторимэп. Этот инструмент помог спланировать работу и запустить «Свою пиццу» за 2,5 месяца. В статье рассказываем, как применяем сторимэп.

      Читать дальше →
    • Интерактивная кредитка для ввода платежа

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



        Интерфейсная анимация сейчас в тренде. Причин несколько: улучшение юзабилити и повышение привлекательности продукта в целом. И третья — развитие инструментов для анимирования на глобальном IT рынке. Сейчас так много разных утилит, чтобы оживить любой дизайн / прототип, что странно было бы пройти мимо такого движения, нужно приобретать навыки. Инструментов множество, перечислять все не буду. Но об одном конкретном упомяну…

        Я работаю в Axure. Самый весомый плюс для меня оказался в нём благодаря возможности создавать интерфейсы практически сразу в браузере. Я вижу все элементы, шрифты, отступы сразу в “боевой готовности”, едва успев внести их в макет. Я знаю, что такими же увидят их разработчики. Я знаю, что в 99% ничего “не поломается” в дизайне.
        Читать дальше →
      • Пятница: все дизайнеры интерфейсов попадают в ад…

          image

          Каждый раз, когда я вижу надпись «Обновить сейчас или напомнить завтра», у меня возникает улыбка, при мысли о том, что все люди, участвовавшие в разработке подобных диалоговых окон (с*ки, верните кнопку «Нет и никогда больше не спрашивать»), окажутся в тепленьком уютненьком аду, где им нужно будет просто ввести телефонный номер…
          Читать дальше →
        • Мобильный UX-дизайн: Как правильно запрашивать у пользователей разрешения

          • Translation
          image

          Вы знали, что среднестатистическое приложение теряет 80% своих ежедневных активных пользователей в течение 3 дней после установки? В большинстве случаев люди устанавливают приложение, открывают его и удаляют. Пользователи пробуют много приложений, и в течение нескольких дней они решают, какие оставить, а какие удалить.

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

          ● доступа к данным о местоположении

          ● доступа к контактам

          ● доступа к камере
          Читать дальше →
          • +7
          • 13.1k
          • 3
        • 01 Ссылки для UX-специалистов

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


            Читать дальше →
          • Что не так с интерфейсами авиасервисов и как это исправить: подход проекта Aviageek

              image

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

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

              Эта схема, безусловно, доказала свою жизнеспособность, однако и она не лишена недостатков. Мы постарались исправить ситуацию в проекте Aviageek.
              Читать дальше →
            • Юзабилити-тестирование по шагам или оценка дизайна HCD

                Согласно стандарту HCD (Сайт: ISO 9241-210: Human-centered design) есть этап оценки дизайна, именно в нем может проводится качественное юзабилити-тестирование.

                Написать данную статью меня заставили проблемы, которые возникали при проведении мною юзабилити-тестирования. Надеюсь, я помогу кому-нибудь более точно определить, когда применять юзабилити-тестирование и как избежать некоторых вопросов при его проведении.
                Читать дальше →
                • +3
                • 34.8k
                • 8
              • 9 инструментов тестирования юзабилити


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

                  Юзабилити — это простота использования программных продуктов. Понятие включает следующие нефункциональные аспекты использования ПО:

                  • Эффективность (выполнения задач пользователем).
                  • Результативность (по времени выполнения).
                  • Удовлетворение (опытом пользования) в указанном контексте использования (пользователи, задачи, оснащение и окружения).

                  Рассмотрим инструменты для измерения юзабилити. Мы использовали три основных критерия оценки:
                  Читать дальше →
                  • +5
                  • 19.8k
                  • 3
                • A/B тестирование: 70 ресурсов, которые послужат хорошим стартом для начинающих

                  • Translation
                  Сделать веб-сайт доходным можно двумя способами. Первый – привлекать больше трафика, второй – повышать конверсию, т.е. побуждать большее количество посетителей становиться покупателями. Скорее всего, вы уже слышали о том, что трафик можно просто купить – сотни интернет-ресурсов предлагают эту услугу. А не лучше ли оптимизировать конверсию? Как узнать, что именно нужно проверить, и как провести A/B тестирование?

                  А/В тестированию и оптимизации уровня конверсии посвящено бесчисленное количество ресурсов. Однако, очень редко на сайтах подробно разбирается весь этот процесс целиком от самого начала («Что и как тестировать?») и до конца («Как улучшить конверсию?»).
                  Читать дальше →
                  • +44
                  • 54.8k
                  • 5
                • Знай своего потребителя, или Отраслевые решения Oracle

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


                    Читать дальше →
                  • Интеграция дизайна мобильных приложений. Часть 1: Android



                    Этот доклад я прочитал на Dribbble Meetup 2013, который прошел в Москве в День космонавтики. В нём описан мой процесс интеграции дизайна — то есть в каком виде передавать приложение от дизайнера к разработчику мобильных приложений. Выбор интсрументов, которые я использую в работе, и сам процесс сформировались опытным путём, методом проб и ошибок. Надеюсь, он поможет сохранить вам немного времени и избавит хотя бы от части рутинной работы. Так как презентация содержит достаточно большое количество слайдов, я решил разбить материал на две части. Первая часть — интеграция дизайна под платформу Android. Вторая — под iOS и Windows Phone, а также упомяну про Samsung Bada. Дальше — много картинок.
                    Читать дальше →
                  • Интеграция дизайна мобильных приложений. Часть 2: iOS, Windows Phone



                      Это вторая часть доклада, который я прочитал на Dribbble Meetup 2013 в Москве. В первой части я подробно описал свой процесс интеграции дизайна под платформу Android. Эта часть — про интеграцию дизайна под iOS и Windows Phone, а также я вскользь упомяну про Samsung Bada 2.0. Дальше — много картинок.

                      Читать дальше →
                    • Анализ источников трафика для повышения конверсии

                      Google Analytics - мощный инструмент для анализа трафика В этой статье речь пойдет о том, как правильно анализировать источники трафика, например, с помощью инструментов Google Analytics или Yandex Metrica. Отключив источники с низкой либо нулевой конверсией, можно существенно поднять общую конверсию, снизить стоимость заказа и улучшить рентабельность интернет-рекламы.

                      Цель этой статьи — получить отзывы и замечания по описанным ниже методам, описать способы принятия обоснованных решений по блокировке некачественных источников трафика.
                      Читать дальше →
                    • Пользовательские параметры и показатели в Universal Analytics

                        Возможность использования «пользовательских параметров и показателей» пришла вместе с новой версией Google Analytics. Если ранее, в ставшей уже классической версии Google Analytics, нам была предоставлена возможность манипулировать 5-ю пользовательскими переменными, то теперь в Universal Analytics мы можем использовать до 20 пользовательских параметров и показателей.

                        Для удобства работы с материалом я разделил его на блоки:
                        • 1.Что такое пользовательские параметры и показатели?
                        • 2.Для каких целей могут быть использованы пользовательские параметры и показатели Universal Analytics?
                        • 3.Ограничения использования пользовательских параметров и показателей.
                        • 4.Создание пользовательских параметров и показателей.
                        • 5.Установка значений пользовательских параметров и показателей.
                        • 6.Работа с пользовательскими параметрами и показателями в отчетах Google Analytics.


                        Что такое пользовательские параметры и показатели?
                        Читать дальше →
                        • +1
                        • 16.1k
                        • 2
                      • 9 основных принципов отзывчивого веб-дизайна

                        • Translation

                        Отзывчивый дизайн — отличное решение проблемы корректного отображения сайта на разных экранах. Однако новичкам зачастую трудно понять основы, обучаясь только по книгам/статьям. С каждым днём появляется всё больше различных устройств, имеющих разные размеры экрана, поэтому создание дизайна в пикселях и только для настольных компьютеров/смартфонов остаётся в прошлом. Именно поэтому сейчас стоит изучить принципы отзывчивого дизайна — дизайна, совмещающего в себе адаптивность и резиновость (если вы ещё не знакомы с адаптивным дизайном, то эта статья будет хорошим выбором для начала изучения).
                        Читать дальше →
                      • Повышение конверсии: как создать карточку товара, который хочется купить

                          Добро пожаловать в блог компании Witget.com. Продолжаем вчерашнюю статью про повышение конверсии на примере сайта компании Nike.
                          Cтраница с информацией о товаре — это важный инструмент в работе с клиентами, и качество пользовательского взаимодействия на этих страничках напрямую влияет на продажи. Если показатель конверсии вашего сайта ужасающе низок, в первую очередь стоит проверить именно карточки товаров. А что если потенциальный клиент действительно очень хотел купить ваш продукт, но не смог найти нужный оттенок? Или он хотел не просто выбрать цвет товара, а разглядеть в мельчайших деталях, как будет выглядеть его будущая покупка в этом цвете? Возможно, интересующего клиента товара просто нет в наличии, и вы спокойно даете посетителю уйти, не попытавшись получить его контакты. В данной статье Томми Уолкера, написанной от первого лица, вы можете ознакомиться с примерами страниц с информацией о товарах, как удачных, так и не очень. Кейсы повышения конверсии с помощью изменения различных элементов интерфейса помогут вам не совершить распространенных ошибок. Как же помочь потенциальному клиенту найти именно то, что он хочет больше всего?
                          Несколько лайфхаков для страницы товара - читать
                          • +15
                          • 16.2k
                          • 2
                        • Как повысить конверсию сайта (на примере компании Nike)

                            Карточка товара или страница с информацией о товаре — очень важный инструмент на сайте любого интернет-магазина, именно здесь посетитель принимает окончательное решение о покупке. Почему-то очень многие в сегменте e-commerce не уделяют этим страницам должного внимания. А ведь именно на этой страничке складывается первое впечатление о товаре в сфере онлайн-торговли. Как создать страницу товара, которая будет эффективной и повысит конверсию сайта? На этот вопрос невозможно дать односложный ответ, но может быть полезным рассмотреть успешные примеры эффективных страниц товара, которые подобрал Томми Уолкер. Как информацию о своих продуктах подает Nike? А как этого делать не стоит? Ниже — подробный анализ отличных страниц товаров Nike.com и неудачных страниц других компаний.
                            Страницы товара на Nike.com: почему они эффективнее ваших? Читать дальше...
                            • +6
                            • 13.5k
                            • 5
                          • Настройка интеграции Calltouch и Google Analytics с помощью Google Tag Manager

                              Пришлось столкнуться с задачей настройки интеграции Calltouch и Google Analytics на сайте нескольких клиентов. Сложность заключалась в том, что ранее у них был настроен Google Analytics с помощью Google Tag Manager.

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


                              Пример отчета по событиям с Calltouch

                              Поскольку на сайте клиента была выполнена настройка Google Analytics с помощью Google Tag Manager, то вариант внедрения, предлагаемого сервисом Calltouch, оказался неприемлем. Возник вопрос по интеграции с помощью Google Tag Manager.
                              Читать дальше →
                              • +14
                              • 5.9k
                              • 2
                            • Проектирование интернет-магазина: личный кабинет, корзина, доставка-оплата, рассылка и другое

                              • Tutorial
                              Очередная статья большого обзора функционала интернет-магазинов. Сегодня я расскажу про личный кабинет, избранное, интеграцию с социальными сетями, корзину, доставку-оплату, рассылку и уведомления. Всего, вместе с этой частью статьи, я рассмотрел около 50 модулей современных интернет-магазинов.

                              Прошлые статьи серии можно найти тут:


                              «Серьезное проектирование серьезного магазина. Часть 1. Исследования»
                              «Серьезное проектирование серьезного магазина. Часть 2. Модули интернет-магазина»
                              «Серьезное проектирование серьезного магазина. Часть 3. Карточка товара и не только»
                              «Серьезное проектирование серьезного магазина. Часть 4. Субституты, комплементы, сравнение и другие инструменты увеличения конверсии»

                              Регистрация / личный кабинет


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

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

                              Рис. 1. Личный кабинет.

                              image

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