Ремарка
В тг канале я вместе с вами буду создавать лучшее приложение тайм-менеджмента.
Есть проблема
Сталкивались ли вы с проблемой, когда вам не хватает рук при использовании телефона? Например, у вас одна рука занята пакетами или испачкана в чипсах, а до кнопки "назад" не дотянуться. Или нужно увеличить видео с помощью pinch to zoom, но у вас просто не хватает руки. Если вам это знакомо, предлагаю вам разобраться в этой проблеме вместе со мной. Как её решить, в каких случаях её вообще стоит решать. Рассмотрим конкретные примеры.
Когда интерфейс нужно писать под один палец
Мы каждый день используем телефон и очень часто это происходит в момент, когда мы идём куда-то. Например, листаем тг канал, или новости, пока идём по улице, записываем заметки или пишем сообщение кому-то. Именно для таких повседневных приложений (а это подавляющее большинство) и нужно писать такой интерфейс.
Понятно, если ваше приложение, это профессиональный инструмент, например для рисования или измерения расстояний. Там вовсе не обязательно использовать эту концепцию. Так как рисовать удобно и двумя и тремя пальцами. Профессиональный инструмент подразумевает, что вы подготовились и полностью погрузились в процесс работы, ваши руки полностью свободны.
Какие есть решения на текущий день
Например, мод одной руки (на гифке выше). Вы смахиваете нижнюю полоску вниз и таким образом весь экран на половину смещается вниз. Теперь вы можете одной рукой дотянуться до верхних кнопок.
Также на клавиатуре есть мод одной руки (пример выше), который позволяет дотянуться до всех кнопок на клавиатуре, делая её меньше.
UX/UI дизайн
Казалось бы, если разработчики смартфонов уже придумали мод одной руки, зачем нам, разработчикам приложений, думать об этом? Ответ на это очень прост. Данные решения очень плохие. Вы вероятно вообще впервые слышите про данный мод одной руки, встроенный в ваш телефон потому, что они очень неудобны и этим никто не пользуется. В самом деле, я пытался как-то использовать мод одной руки, но оказывалось гораздо быстрее освободить вторую руку или извернутся как-то, чем потянуть вниз, затем обратно наверх одной рукой. Более того, мод одной руки всегда подразумевает, что палец будет находиться в нижней части смартфона, что в большей мере верно, но не всегда.
Суть концепции ONE TOUCH
Концепцию можно охарактеризовать одним предложением:
Любое действие в приложении можно совершить одним пальцем, в любом положении экрана
Это совсем не отменяет использование мультитача. То есть, например, вы также можете делать zoom картинки двумя пальцами, но это опциональная функция. Если у вас есть зум двумя пальцами, то обязательно также должна быть возможность зума одним пальцем (пусть менее удобно, например двойным кликом).
Реализация
На протяжении долгих месяцев разработки приложения, используя данную концепцию, я открыл для себя много различных решений и здесь хочу с вами поделиться.
1. "длинный скролл"
На примере выше, возможно, вы заметили разницу между "длинным" скролом и обычным. Он как бы продлевает скролл.
В обычном скроле, когда нижняя граница контента, достигает нижней границы экрана, скрол останавливается. То же самое с верхней границей. Таким образом, если палец находиться снизу, мы не можем дотянуться до верхнего элемента и наоборот, если палец находится сверху. Поэтому, мое предложение очень простое: скролл должен останавливаться когда верхняя граница контента достигнет нижней границы экрана и наоборот. Но это выглядит просто, на деле я потратил немало времени. Для этого мне пришлось переписывать и дорабатывать многое, чтобы просто была возможность проскролить ниже.
2. меню
Если мы ставим себе условие: выполнять любое действие одним пальцем из любого положения экрана, то давайте подумаем, что мы вообще можем делать.
свайп влево, вправо, вверх, вниз
тап
двойной, тройной тап и т. п.
Исходя из такого маленького арсенала действий, заранее продумаем как строить приложения.
В идеале ко всем кликабельным элементам интерфейса должна существовать возможность притянуть их пальцем.
Свайп вверх/вниз будет занят под скролл контента. Если же у вас не скролящееся страница, тогда можно придумать какие-то дополнительные назначения этим действиям.
Свайп вправо всегда нужно оставлять под кнопку "назад", если это дополнительное окно, которое закрывается. Если это главный экран, также свайп влево можно придумать свои действия.
Меню, так как оно будет существовать почти везде, на всех страницах (всегда нужно чтобы удобно потом добавлять дополнительные кнопки, если будет доработка). У нас остаётся один выбор - свайп влево. Именно поэтому был выбран такой расклад.
Меню также раскрывается на весь экран и поддерживает "длинный скролл", чтобы каждую кнопку можно было притянуть одним пальцем. Также сами кнопки расположены на всю ширину экрана, чтобы пальцем можно было нажать из любого положения.
На гифке выше видно, как палец находиться в правой нижней части экрана. Не меняя положения пальца, я легко могу дотянуться до любой кнопки правого меню.
3. кнопки на всю ширину экрана
Да, это звучит очень просто. Делая под каждую кнопку отдельную строчку и вытягивая её во всю ширину экрана, в комбинации с "длинным" скролом, мы получаем интерфейс полностью заточенный под один палец.
4.итог
Таким образом, вот как у меня реализован главный экран.
Последнее
Здесь бы я хотел просто призвать всех разработчиков приложений использовать данную концепцию. Пусть даже не в полной мере и не везде. Я считаю, что если ваше приложение подразумевает использование "на ходу", то вы просто вынуждены делать его под один палец, если хотите создать по настоящему удобный интерфейс. Те способы реализации, которые я описал, они не являются в последней инстанции истинными. Вы можете использовать любые другие методы достижения очень простой цели, которая заключается в том, чтобы одним пальцем, в любом положении экрана можно было выполнить любое действие в приложении.
В мега-комбе ONE TOUCH + NO HOURS. Это две концепции, которые я использую в моем приложении. Создаю лучшее приложение для тайм-менеджмента.
Если вы хотите присоединиться к разработке бересты, подключайтесь к моему тг каналу:
тг: gaiusdedeo
