• Схемы рецептов для кухни пиццерии. Процесс, тестирование, инструкция к схемам

      В прошлом посте  я описал процесс создания схем рецептов для пиццерии. Там же я обещал рассказать о процессе работы и тестировании.

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

      Для понимания задачи я приведу пример процесса изготовления Гавайской пиццы. Если на экране пиццамекера высветилось название этой пиццы, он находит инструкцию по ее приготовлению.
      image
      1. Рецепты пицц. Тут можно найти список ингредиентов конкретного продукта.
      2. Схемы количества ингредиентов. Если поступил заказ на пиццу среднего размера (30 см), то пиццамейкер обратит внимание именно на блоки с количествами для этой пиццы.
      3. Инструкция. Она существует для ознакомления с принципами схем. Тут показано что и как зашифровано.


      Сотрудник добавит 15 штук слайсов ветчины в 3 круга, двойную порцию ананасов (3/4 стаканчика два раза) и стандартную порцию сыра Моцарелла для средней пиццы (1 полный зеленый стаканчик — цвета стаканчиков подобраны не случайно, коробки для средних пицц у нас тоже зеленого цвета).

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

      Одновременно с дизайном схем тестировался и дизайн инструкций, которые должны были объяснить человеку принцип работы самих схем.
      О тестировании в деталях
    • Схемы рецептов для кухни пиццерии. Фастфуд плюс дизайн

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

        Чтобы сделать пиццу, сотрудник на кухне должен знать ее рецепт.

        image

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

        Читать дальше →
      • Как сделать так, чтобы не путали пиццы? Интерфейсы трекера пиццерии и их особенности

          Сегодня я расскажу о трекере на кухне Додо Пиццы. На нашей кухне висят планшеты с интерфейсами трекера. Трекер — спинной мозг процесса изготовления пиццы. Он вступает в действие с момента принятия заказа и до передачи термосумки с пиццей курьеру.

          Трекер состоит из интерфейсов, каждый из которых выполняет свою важную функцию. Каждый интерфейс показывает пользователю (сотруднику кухни) какие-то конкретные параметры продукта.

          image

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

          Типы продуктов:
          • Выпекаемые: пиццы (экраны: Тесто, Начинка, Упаковка)
          • Полуфабрикаты: салаты, картошка, кукуруза (экраны: Закуски, Упаковка)
          • Простые: напитки, маффины (добавляются в завершении, на схеме не показаны)


          Все продукты в завершении распределяются по экранам выдачи (экраны: Курьеры и Выдача в зал).

          Каждый экран выводит определенное количество типов продуктов. Для каждого продукта выводятся определенные параметры (названия, размеры, толщина теста и т.д.). Цель — сделать так, чтобы работа с интерфейсами вызывала минимум ошибок у сотрудников. Я покажу, как шла работа над интерфейсами и какими были попытки сделать так, чтобы сотрудники не путали пиццы.
          Читать дальше →
        • Адаптивная навигация: куда деть меню на смартфонах


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

            Так как я имею отношение к опен-сорсному адаптивному HTML5-шаблону Simpliste, то решил все существующие возможности работы с навигацией испробовать на практике. Но кроме получения собственного опыта, мне удалось создать несколько наглядных примеров, доступных для использования любым желающим, а также подготовить описание процесса, с которым приглашаю вас ознакомиться.
            Читать дальше →
            • +13
            • 48.8k
            • 3
          • CSS3: жизнь без префиксов

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

              Проблема очевидна. Нужен способ облегчить работу с префиксами.

              Естественно, перестать использовать префиксы было бы неразумно. Но переложить обязанность по их генерации на существующие специально для этого инструменты вполне возможно. Я попробовал перечислить возможные варианты.
              Читать дальше →
            • CSS3 с погружением

                CSS3 видели и пробовали все, кого он мог заинтересовать. И закругленные уголки и падающие тени мы уже можем генерировать без лишнего труда.

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

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

                Браузеры, поддерживающие свойства перечислены в виде CSS комментариев. Генераторы и инструменты чаще всего могут выполнять сразу несколько функций, поэтому в таких случаях я указывал их только там, где они, по-моему, справляются лучше всего.
                Читать дальше →
              • Simpliste: всего одна неделя


                  Не знаю, как для вас, а для меня прошедшая неделя оказалась насыщенной. Чуть больше недели прошло с момента первого поста о Simpliste и чуть меньше с момента второго поста. Эти несколько дней принесли и неожиданные, и приятные события.

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

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

                  Итак, правила были объявлены и неделя прошла в работе.
                  Читать дальше →
                • Simpliste: засучим рукава


                    После моего поста в прошлый четверг не осталось сомнений в том, что простой и бесплатный шаблон (кто-то даже называет фреймворк) с адаптивной версткой на HTML5 вызывает интерес у потенциальных пользователей. Пост даже собрал достаточно голосов, чтобы НЛО разрешило мне пригласить кого-нибудь на Хабрахабр.

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

                    Одним из преимуществ Simpliste я считаю наличие готовых тем оформления. Сразу, в момент запуска существовало 3 темы. Постепенно я создал еще несколько.
                    Читать дальше →
                  • Keep it simplest. Или про простые сайты

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

                      Очевидным вариантом было бы набросать основную разметку, определить doctype и оставить браузерам работу по стилизации. Но это очень ленивый метод, который дает результат, вызывающий недоумение у будущего посетителя такой страницы. Хочется хотя бы базовой стилизации заголовков и ссылок, какой-то простой структуры.

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

                      Поиск


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

                      Хотя, сейчас появились шаблоны с адаптирующейся разметкой (responsive design), которые и вызвали у меня интерес. К сожалению, большинство найденных решений оказались платными, что не удивительно, учитывая объем работы, который проделывают их авторы.
                      Читать дальше →
                    • Кастомизация Photoshop

                        Фотошоп использую постоянно. Для творческих целей — раз. И по работе, при вёрстке сайтов — два.
                        Изучал программу с интересом. Нашел много книг. Но только ту, которая всё изменила, могу порекомендовать каждому: Photoshop CS Killer Tips by Scott Kelby & Felix Nelson.
                        Уровень профессионализма повышает значительно. За счет клавишных сокращений и особых приемов скорость возрастает очень сильно. Но по-настоящему удобным PS становится после собственноручной
                        Читать дальше →