Сегодня в блоге Mail.ru появились опубликовано итоги конкурса на «Дизайн околопочтового приложения», в котором я принимал участие.
Никакого места в конкурсе я не занял и упоминания в статье не заслужил.
я даже не ждал обещал пригласить на Dribbble. Да ладно.
Судя по всему, мою работу посчитали «полным провалом в визуальном плане»… Я шучу над ним, над визуалом, но всё равно так думаю идеи то, что я вложил в проект, стоит того, чтобы его увидели более 4 человек (именно столько просмотров моих работ на поведение ).
Дело в том, что сами идеи я разрабатываю довольно долго, и конкурсное задание позволяет мне продемонстрировать их на реальной задаче.
Скажу сразу, что по уровню прорисовки и вниманию к деталям другие работы на порядок превосходят мои.
Например, я вообще не рисовал список букв, а взял аналог из другого приложения.
Вместо этого я нарисовал концепцию — принципиальную схему приложения и описал принципы, по которым оно работает. Позволю себе процитировать упомянутый пост, я с ним полностью согласен, и в какой-то степени именно такими мыслями я руководствовался во время работы:
Артем Тройной: Жаль, что некоторые дизайнеры не попытались придумать что-то совершенно новое, а лишь добавили категории для сортировки.Так.Это не тестовое задание при приеме на работу.
В таких конкурсах есть возможность придумать что-то совершенно уникальное, а не то, что будет реализовано после конкурса.
Если вы не передумали читать дальше, добро пожаловать в рубрику)
На изображении выше показан главный экран моего решения.
Визуально это просто кнопка поиска.
Но возможности гораздо выше.
Кнопка становится «ассоциативным элементом» (как я ее называю:) — ее теперь можно «применить» к любому элементу на экране и получить логический ответ. Перетаскиваем кнопку поиска на имя адресата - получаем от него все письма (и все вложения).
Перетащите его на дату и получите электронные письма на этот день.
И так далее.
Смысл идеи в том, что Часто нет необходимости использовать каталог файлов, поиск, фильтры, запоминать язык запросов или полагаться на рекомендательные системы.
Достаточно просто уметь находить буквы, похожие на нужные, по некоторым критериям.
А сделать это можно просто перетащив значок поиска на нужный элемент. Многие типовые задачи можно свести всего к одному действию, например, если вы хотите найти все фотографии во вложениях, вам достаточно перетащить значок поиска на любую фотографию.
Классический подход потребует, как минимум, зайти в раздел вложений, выбрать поиск по типу файлов, указать тип файла «изображения»… Но что, если вам нужно найти фотографии, отправленные конкретным пользователем? Нам нужен какой-то механизм объединения запросов.
Что делать, если вам нужно найти, скажем, pdf-документ, но под рукой нет «образца»? Опять придумывать разделы, списки, группировки, язык запросов и т.д.?.
Все проще.
Сначала вам нужно разрешить объединение запросов.
Перетащив кнопку поиска к нужному получателю, а затем к любой картинке в результатах поиска, мы сформируем нужный запрос.
Что делать, если «образца» нет? Нам нужно добавить понимание «связей» между критериями поиска.
Например, если мы ищем по имени адресата, а он в основном присылает счета, то логично не заставлять пользователя искать подходящий счет, а сразу предложить такой запрос в виде возможного уточнения.
Или более сложный.
Пользователь ищет все письма, отправленные одним адресатом.
Но результатов, конечно, много.
Мы можем сгруппировать результат и выделить значимые группы.
Например, оказалось, что уведомлений о заказе билетов и документов в различных форматах очень много.
Но ни фотографий, ни уведомлений не было.
В качестве пояснения предлагаем «документы» и «билеты».
А если пользователь выберет «документы», возможно, новыми дополнениями будут «счета-фактуры» или «сметы»… Дело в том, что мы не пытаемся решить за пользователя, «что ему нужно» — как это делают многочисленные «умные помощники».
Но мы не заставляем его бродить по меню и спискам в поисках нужного пункта.
Наша задача – предложить в каждый момент именно те варианты, которые максимально соответствуют запросу.
Процитирую свою работу: Представьте, что у вас есть список фильтров, по которым вы можете выполнять поиск.
Например: «фотографии», «документы», «счета», «покупки», «архивы», «задачи», «даты» и т. д. Фильтров может быть много, фильтрами могут быть все получатели, фильтрами могут быть диапазоны дат («прошлая неделя», «зима 2014») и т. д. При обновлениях программа может научиться обнаруживать новые фильтры, например «авиабилеты».
или «3D-модели».
Имея перед глазами такой список, вы можете выбирать фильтры и комбинировать их, чтобы легко строить сложные запросы.
Например, «счета-фактуры с ebay за 2014 год» — это три фильтра «ebay» + «счета-фактуры» + «2014».
Но использовать список из сотен фильтров было бы крайне неудобно.
Решение — соединить фильтры друг с другом с помощью ассоциативных связей.
Тогда «счета-фактуры» будут связаны с «документами» и «покупками».
«2014» будет ассоциироваться с «календарем», а «весна» — с «2014», «2015», «2016» и так далее.
Показывая пользователю лишь несколько основных фильтров, а также те, которые имеют отношение к уже выбранным, мы получаем быстрый и удобный конструктор для построения запроса буквально в несколько тапов.
Это проще, чем набирать запрос на экранной клавиатуре, хотя запрос, конечно, тоже можно набрать (белая линия вверху).
На картинках видно, что связи между фильтрами рассчитываются исходя из содержимого почты.
Если вы в основном получаете новости и аккаунты с адреса [email protected], то этот контакт будет связан с фильтрами «новости» и «аккаунты».
Фильтр «фото» связан с контактом «Андрей», хотя, чтобы увидеть больше контактов, вам придется немного расширить список фильтров.
В заключение скажу, что идеи 1 и 2 дополняют друг друга.
Вместе они образуют интерфейс управления данными, построенный на ассоциациях.
Вместо изучения нескольких экранов, меню, фильтров, настроек и т. д. Пользователь получает всего два интуитивных действия: перетащить иконку поиска на аналогичный элемент и использовать «умные» фильтры для уточнения запроса.
Более того, большинство проблем можно решить на первом этапе.
А второй, помимо удобства, будет выполнять еще и незаметное тренировочное действие.
Ведь, привыкнув к набору фильтров, пользователь сможет использовать их даже без подсказок, например, с голосовым управлением.
Сам ассоциативный подход я разрабатываю уже давно, а здесь просто постарался показать некоторые разработки на «живом примере».
Если вас заинтересовал такой подход, напишите мне на [email protected], сейчас мы разрабатываем аналогичное решение для управления файлами на обычных компьютерах.
Спасибо за чтение) Даниил Бакалин.
09.2015. обновление.
В комментариях многие писали, что по внешнему виду кнопки непонятно, можно ли ее перетаскивать.
Согласен, взять стандартную кнопку в данном случае было моим упущением.
Я просто попытался передать саму концепцию превращения кнопки во что-то совершенно другое.
На самом деле это вообще не кнопка, а самостоятельный объект. с которым можно взаимодействовать более сложным образом, чем просто «щелкнуть».
В концепции «ассоциативного дизайна», которую я разрабатываю, есть несколько типов таких элементов.
Но суть их всех в том, что они принципиально разные.
Это не просто плоские картинки, которые можно перемещать или нажимать.
Они могут существовать в виртуальной реальности или, скажем, в ментальном интерфейсе или в каком-то другом виде.
Хочу сказать, что теперь, управляя компьютером, мы в голове «переводим» свою задачу на понятный компьютеру «язык», в виде последовательности каких-то кликов, выделений или тапов.
Мы к этому привыкли так же, как когда-то люди привыкли к командной строке, и нам это кажется правильным и логичным.
Но это нелогично и неправильно.
Человек мыслит образами и ассоциациями, а не кнопками и списками.
И эти образы и ассоциации так или иначе должны присутствовать в интерфейсе будущего.
Я не говорю, что моя концепция верна или даже что я двигаюсь в правильном направлении.
Я просто пытаюсь найти что-то за пределами привычных интерфейсов.
И хотелось бы услышать комментарии по самой идее.
Представьте, что вы пытаетесь объяснить, что такое меню, человеку, который всю жизнь пользовался только командной строкой.
И придирается к тому, что цвет курсора напоминает ему командную строку, да и вообще передвигать кусок мыла по столу, пытаясь попасть в движущиеся строки на экране, странно и неудобно.
Я не умаляю роль командной строки сегодня.
Точно так же, как я уверен, что сегодняшние интерфейсы останутся в сложных системах и конфигураторах завтрашнего дня.
Но типичные, общие интерфейсы должны измениться.
Я не могу поверить, что то, что мы имеем, — это вершина развития.
Конечно, есть и голосовые помощники, и хотя сегодня они не всегда применимы, с развитием ИИ их доля обязательно увеличится.
Но даже если ИИ станет близким к человеку, будет ли достаточно голоса? Допустим, вам нужно разработать сайт. Сколько времени потребуется, чтобы объяснить другому человеку, как это должно выглядеть (по сути написать техническое задание)? А сколько мелочей останется «за кадром»? И насколько проще создать сайт в диалоговом режиме И возможность влиять на любой элемент во время создания? Что проще, сказать «увеличить логотип на 8% и сдвинуть его влево до пересечения с направляющей, объединяющей текстовые отступы основного блока контента» — или просто переместить логотип? Что проще, найти нужного получателя, растерявшись, продиктовав правильный запрос (типичный голосовой помощник), или просто приблизить объект «контакты», который потом будет разбит на кластеры по типу переписки, а после просмотрев нужный, выбрать адрес (объекты+ассоциации+голосовой помощник)? .
Вообще это тема отдельной статьи.
Я просто хочу сказать, что управлять чем-то одним лишь голосом не так-то просто.
Но типовые интерфейсы тоже неудобны.
Необходимо что-то между ними, работающее по принципам человека, но предоставляющее ему новые возможности.
Теги: #конкурс #облако #дизайн #Дизайн мобильных приложений #почта #интерфейсы #приложения #dribbble #оскорбление
-
Домашняя Сеть — Обмен Файлами Стал Проще
19 Oct, 24 -
Мини-Рабочий Стол Своими Руками
19 Oct, 24 -
Форум Мира Инноваций Hp
19 Oct, 24 -
Вашему Вниманию Новые Графики Github
19 Oct, 24 -
Ctrl+Enter, Чтобы Отправить Комментарий
19 Oct, 24 -
Вопрос Для Экспертов Javascript
19 Oct, 24