Захотели сделать трафарет для упрощения бумажного проектирования интерфейсов. По образцу тех, что можно найти на UIStencils.com, но с местной спецификой.

Зачем? Для начала посмотреть, пригодится ли в жизни такая штуковина. Вторая задача — поощрить внутри себя использование ручки-бумаги вместо специальных UX-программ. А проще говоря — поиграть.

Требования осознали вот такие.
  1. Металлический. А то пластиковый выглядит скучной дешёвкой.
  2. Только со сложными силуэтами. Квадратики-кружочки-стрелочки лучше всё-таки от руки рисовать.

Как видите, немного.

Что ставить, какие силуэты?
Обсудили и составили гигантский список.
  1. Социальные сети: ВКонтакте, Facebook, Instagram, LinkedIn, «Одноклассники», Twitter, Pinterest, Google+.VK
  2. Мессенджеры: WhatsApp, Skype, Телеграм, Viber, Slack, «Сообщения» на iOS, LiveTex.
  3. Операционки: Apple (да, мы знаем, что это фирма), Windows, Android, Ubuntu.
  4. Браузеры: Chrome, Safari, MS Edge, Firefox, Яндекс.Браузер, Opera.
  5. Жесты смартфона: тап, свайп, зум, скролл, курсор рука, курсор стрелка.
  6. Сервисы (инфраструктура): Dropbox, 1C, Google Drive, Яндекс.Диск, Яндекс.Маркет.
  7. Монстры отрасли: Google, Яндекс, Mail.ru, Wikipedia, Pornhub.
  8. Символы-полезняшки: загрузка, WiFi, Bluetooth, батарейка, облачко, календарь, комментарий, кошелёк, банковская карта, фотоаппарат, звёздочка, сердечко, Fb-лайк, круговая диаграмма, ключ, QR-код.
  9. Крупное: линейка пиксельная, линейка обычная, контуры iPhone, контур России, символ Петербурга, символ Москвы.

Из итогового варианта многое повычёркивали — не влезло или расхотелось.

Один из первых вариантов — ещё до выравнивания и подготовки под лазерную резку — выглядел вот так.



На производстве ждали сюрпризы.
  1. Принимают только файлы в формате CorelDraw.
  2. Долго (около недели) возятся с созданием пробной версии.
  3. И только после пробника готовы называть цену.

Пробник получился таким.



Производство посчитало и цену: 800 руб./штука.
Дорого, но пока не об этом речь.

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



На ней видны основные проблемы трафарета.
  1. Ручка уменьшает контур. Чтобы результат был как надо, нужно раздвигать границы фигур на трафарете. Причём под фиксированную толщину стержня. А если хочется не так сильно зависеть от стержня, то придётся упрощать прорисовываемые объекты.
  2. Некоторые контуры слишком сложные, ручка скачет. Заштриховать можно, а вот обвести никак не получается. Выбрасываем.
  3. Кое-что (календарь, жесты), возможно, стоит заметно увеличить. В маленьком варианте они не особо нужны.
  4. Очень трудно делать мелкие скругления. Если не увеличить, то выбрасываем.
  5. Может быть, сделать трафарет вовсе не под ручку-карандаш? Существуют, например, трафаретные кисти — вдруг они тут поуместней будут?

Проблемы, которые не видны.
  1. Верно ли мы подобрали набор контуров на трафарете? Что убрать, что добавить?
  2. Нужна ли людям такая штуковина?

Про востребованность — рынок решит. Может быть, через Boomstarter. Посмотрим.

А по содержанию трафарета — высказывайтесь в комментариях, пожалуйста.

Комментарии (10)


  1. valemak
    30.04.2016 17:23
    +2

    Не нужно.


    1. sobakapavlova
      04.05.2016 16:07

      Значит, не купите :)


  1. ISergius
    02.05.2016 15:48

    Сделайте голосование. Будет видно, нужно ли это большинству.
    Далек от проектирования UI, но я бы взял.


    1. roboter
      02.05.2016 16:56
      +3

      я тоже далёк от UI проектирования на бумаге, но думаю иконки соц сетей это последнее что нужно в UI проектировании.


      1. sobakapavlova
        04.05.2016 16:10

        Внутри нашей команды тоже нет единого мнения по этому вопросу.


    1. sobakapavlova
      04.05.2016 16:10

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

      Поэтому мы давно не ждём ничего полезного от голосовалок.
      Но сделаем Bootstrap-проект. Когда доточим идею (пока она всё-таки недостаточно прекрасна по нашим внутренним критериям).


  1. Talyutin
    04.05.2016 13:33

    Для каждого типа приложения нужен свой трафарет со своим набором элементов, как, например уже давно сделано тут http://www.uistencils.com/collections/stencils


    1. sobakapavlova
      04.05.2016 16:11

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

      Может быть, нужно делать отдельные трафареты для чего-то. Вот только для чего? «Тип приложения» — это не то, что нас вштыривает, sorry. Думаем дальше.


      1. Talyutin
        04.05.2016 16:17

        Уточните, что значит «но с местной спецификой»? Чем ваши трафареты будут отличаться от тех, что по ссылке?


        1. sobakapavlova
          04.05.2016 23:59

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