Дизайн мобильных приложений — это по сути создание мобильной версии сайта с дополнительными возможностями. При этом главная задача разработчиков заключается в создании удобной экосистемы с совершенным UX.
49 832 просмотров
Приложение Path для построения карьерного трека Веб-студия полного цикла IGNI
Скачивая какое-либо приложение, юзер по умолчанию лоялен: он уже совершил целевое действие, и если он сможет решить свою проблему с помощью вашего сервиса — то будет пользоваться им на регулярной основе. Однако если хотя бы один раздел на пути клиента не работает или неудобен — человек просто удалит ваше приложение – и не вернется к нему никогда.
В этом заключается принципиальное отличие UX-дизайна сайтов и приложений: как правило, пользователь оценивает удобство нескольких веб-продуктов, и даже если при первом визите человек не совершил целевое действие, всегда есть вероятность, что спустя некоторое время он вернется на ваш сайт. При этом повторное скачивание приложений — это скорее исключение, чем распространенная практика.
Я НАУЧУ играть ТЕБЯ в OSU! за 8 МИНУТ
Анализ аудитории и UX-дизайн приложения
Перед тем, как переходить к прототипу, дизайнер должен провести анализ конкурентов, целевой аудитории и задач, которые стоят перед приложением. Например, если ЦА — женщины, то кнопки и другие элементы взаимодействия можно делать меньше, если мужчины — крупнее. Большинство пользователей нажимают на экран большим пальцем, так что такая незначительная деталь поможет мужской аудитории комфортнее взаимодействовать с сервисом.
Дизайн приложения Path – ознакомление Веб-студия полного цикла IGNI
На этапе UX-разработки дизайнер должен продумать весь путь пользователя от начальных экранов знакомства — и до выполнения целевых действий, которых в приложении может быть несколько. Как правило, User Journey представляет собой ветвистое древо возможностей с разным функционалом: подпиской на приложение, обращением в службу поддержки, чтением текста, оплатой товара и так далее. И каждая “ветвь” должна быть хорошо продумана уже на этапе прототипа.
В проектировании интерфейса есть несколько важных деталей, о которых дизайнер и заказчик должны знать:
- основные элементы управления приложением должны быть внизу; верхний левый угол в App дизайне задействуется минимально и только для определенных целей, например, кнопки “Назад”, так как к ней сложно тянуться;
- управление необязательно выполняется только с помощью кнопок; в приложении пользователь может смахивать или удерживать определенные элементы для управления;
- приложения можно скроллить как снизу вверх, так и справа налево; если вы используете боковой скролл, то следует дать пользователю подсказку;
- логотип не стоит дублировать на всех экранах приложения; достаточно того, что ваш бренд будет на иконке сервиса и на экране загрузки;
- шрифты не должны быть необоснованно маленькими; для заголовков в веб-студии IGNI мы, как правило, используем шрифт 18 – 24 px, для основного текста — 14 – 16 px, для подсказок — светло-серые шрифты 12 – 14 px; также стоит использовать дифференциацию толщины шрифтов для визуальных акцентов;
- цвета должны быть диверсифицированы и нативно подсказывать пользователю, какие элементы кликабельны, а какие — нет; также цветом разграничиваются разные по смыслу элементы;
- подсказки — это хорошо; если есть вероятность, что пользователь несколько раз будет нажимать на некликабельный элемент или у вас присутствуют нестандартные элементы управления — добавьте tooltip.
Дизайн приложения Path – выбор навыков Веб-студия полного цикла IGNI
UI-дизайн приложения и создание адаптивных версий
Как быстро и легко пользоваться нейросетью Midjourney? Инструкция
После того, как вы спроектировали интерфейс, можно переходить к визуальной составляющей и “вычищать” приложение. Основная задача на данном этапе заключается в том, чтобы привести дизайн к единому Style Guide.
На все приложение желательно использовать не более 5 – 6 типов одного шрифта (разного размера, цветов и толщины) и 4 – 5 цветов. Этого достаточно для расставления акцентов и создания аккуратного интерфейса. Также стоит продумать анимацию перехода с одного экрана на другой: исчезновение, смещение, прелоадер и др. При подборе цветов также стоит учитывать, что цветовая палитра Iphone, как правило, лучше, чем палитра Android-устройств, а значит нужно отказаться от грязных и смежных цветов.
На финальном этапе происходит разработка адаптивных версий. Если приложение будет доступно только для iOS – вам повезло, ведь на этапе создания адаптивов вам достаточно отрисовать только две версии: для Iphone 6 и Iphone X. Однако если ваша задача – это сервис для Android, то придется отобрать 4 – 5 наиболее популярных разрешений в конкретном сегменте целевой аудитории.
Дизайн приложения Path – профиль пользователя Веб-студия полного цикла IGNI
Тестирование юзабилити
Важным этапом UX-дизайна является тестирование юзабилити готового интерфейса. Оно включает в себя оценку прототипа по ряду параметров:
- эффективность – достижение пользователем задач;
- результативность – время, затраченное на достижение цели;
- удовлетворение качеством сервиса и пользовательским опытом.
Самым простым вариантом проведения тестовых сессий будет создание кликабельных прототипов в Figma и запись процесса пользования сервисом с получением последующей обратной связи. Однако есть и более продвинутые сервисы, которые в режиме реального времени транслируют процесс взаимодействия пользователя с приложением, например, Userlytics, TryMyUI и UserTesting.
После этого миссия дизайнера в создании мобильных приложений считается выполненной.
Материал подготовлен арт-директором веб-студии IGNI Дмитрием Мурашкиным.
Показать ещё
21 комментарий
Написать комментарий.
Дизайн мобильных приложений — это по сути создание мобильной версии сайта с дополнительными возможностями.
Лол, правда?
Тогда это объясняет многие проблемы с дизайном у приложений.
Развернуть ветку
Развернуть ветку
шрифты не должны быть необоснованно маленькими
У вас как раз такие. По крайней мере меньше, чем это принято по стандартам iOS.
Развернуть ветку
Кривой UX не учитывающий особенности платформы. Даже в вашем примере, этот гамбургер в правом углу противоречит привычным паттернам взаимодействия с iOS, да и вообще эргономике. Попробуйте воспользоваться этим меню держа телефон в одной руке. И такого много, от основной навигации, до анимации переходов между состояниями. Пренебрежение правилами типографики, игнорирование accessibility standards. Хотя бы это
Развернуть ветку
Ну вот вам скрин приложения VC с закладкой и «поделиться» в верхнем правом углу. Это вполне удобно. И где по-вашему должно быть меню?
Развернуть ветку
Вы сами можете видеть где находится меню на вашем скриншоте (внизу, где и другие часто используемые функции)
Развернуть ветку
Большинство людей правши и используют большой палец для навигации на смартфонах. Не вижу преград располагать бургер в правом верхнем углу. Почему это кривой UX?)
Интересно взглянуть на ваше портфолио))
Развернуть ветку
используют большой палец для навигации на смартфонах.
Вот именно. И в верхний правый угол каждый раз тянуться неудобно (особенно на современных смартфонах с большим экраном). Даже в Андройде перенесли основную навигацию в нижний таб бар.
Интересно взглянуть на ваше портфолио))
А что множество исследований и гайдлайны iOS и Android без моего портфолио уже неубедительны?
Развернуть ветку
Аккаунт удален
Развернуть ветку
Вообще сама концепция бургера уже давно себя изжила. Т.к. вы трудитесь в данной сфере, то уверен, что исследования по этому поводу вы читали, посему пруфы искать не буду.
Правый и верхний угол моб устройства попадают в красную зону на устройствах с диагональю выше 5 дюймов (может и больше, точно не помню). Поэтому размещение в углах какого-либо функционала само по себе неоправданно с точки зрения юзабилити.
Развернуть ветку
Такое предоставление информации это полный пи**ец и надругательство над здравым смыслом. Как это расшифровывать? Что означает частично заполненная пробирка фигмы и что означает чуть менее заполненная пробирка скетч? Насколько между ними разница? Как ее понять и посчитать? Как формируется эта пробирка и как считается каждая риска которой эта пробирка заполняется?
Если баллами, цифрами или оценками, то может уйти от этой дебильной непонятной графики и написать оценку или баллы?
Есть человеческие понятные значения «хорошо», «плохо», «отлично» и подобные слова. Можно балльную систему, например результат 70 из 100, где будет понятно из чего сложился каждый балл и где можно его улучшить. К какому х*ю эти тупые безликие пробирки где все цветными полосочками заполняется я не понимаю.
Как эту картинку адекватно прочесть? Какие из нее выводы можно сделать? Что типа я вот на именно эту пустоту незаполненную недотягиваю до какой то оценки или что?
Есть дизайн, а есть здравый смысл. Таких дизайнеров как вы надо сначала учить работать с информаций, базами данных и выводом/предоставлением инфы. А это все дизайны месячных выпускников курсов по дизайну для беханса слепленные на коленке. Красиво нарисовано и никакого смысла. Сидят учат как UX делать и не знают про зоны безопасности в iOS.
Пи**ец.
Источник: vc.ru
Программное обеспечение «Dolphin Guide»
Доступная рабочая среда для незрячих и слабовидящих
Данное программное обеспечение предназначено для незрячих и слабовидящих пользователей, которые ранее никогда не имели опыта общения с компьютером. Доступная рабочая среда «Dolphin Guide» позволит:
- Писать, отправлять, получать и читать электронные письма.
- Создавать и читать собственные документы, заметки и прочее.
- Пользоваться Интернетом.
- Играть в компьютерные игры, слушать музыку и аудиокниги, а также многое другое.
Основные преимущества
Просто и легко
Dolphin Guide разработан с нуля, чтобы пользователи могли достичь желаемых результатов быстро и с минимумом нововведений, что означает простоту и легкость использования без лишних волнений и суеты. Нет необходимости в запоминании горячих клавиш. Dolphin Guide использует очень простую структуру меню и легкие, простые инструкции для каждого действия, например: «Написать письмо, нажмите 1; создать документ, нажмите 2; доступ в Интернет, нажмите 3».
Сопровождение каждого шага
Dolphin Guide читает всё вслух, благодаря чему вы никогда не потеряетесь и не запутаетесь, а это значит, что вы будете уверены в каждом своем шаге. Операции с компьютером осуществляются при помощи простого использования клавиатуры, мыши или голосовой активации. Dolphin Guide может при необходимости увеличить информацию на экране, а также предоставит помощь по любой функции при нажатии клавиши.
Полный набор функций
Dolphin Guide предоставляет всё для общения, развлечения и для организации информации. Какую бы функцию вы не использовали — можете быть уверены, что это легко и просто.
Основные возможности
Полный доступ
Полное озвучивание всех действий
Dolphin Guide озвучивает каждый шаг ваших действий. Вы можете изменять голос сопровождения по своему желанию, настраивать скорость, наиболее подходящую именно вам. Выбрать мужской или женский голос, или полностью отключить голосовое сопровождение — выбор за вами.
Увеличение экрана компьютера
Dolphin Guide позволяет вам увеличить экран для более детального просмотра изображения или документа.
Выбор высококонтрастных цветов для вашего комфорта
Интерфейс и работа Dolphin Guide может быть полностью настроена под индивидуальные нужды. Среди прочего, вы можете изменять цвет фона, цвет текста и тип шрифта.
С Dolphin Guide доступно:
Общение
- Отправка и получение электронной почты. Пошаговые инструкции при создании, отправке, получении и чтении электронной почты
- Использование сети Интернет. Для перемещения по веб-странице используется всего три кнопки! Возможность выбора режима «только текст», а для слабовидящих также доступен выбор основного цвета, цвета фона и подсветка текста во время чтения.
- Сканирование и чтение книг и корреспонденции
- Составление писем и документов
- Использование Skype для совершения бесплатных звонков через Интернет
- Использование обмена мгновенными сообщениями
Развлечения
- Возможность играть в игры. Включает собственный набор простых игр.
- Обучение машинописи. Включает 16 уроков, помогающих изучить клавиатуру и освоить быструю печать.
- Прослушивание Интернет радиостанций и подкастов со всего мира. Работает также в фоновом режиме.
- Воспроизведение DVD, CD и MP3
- Чтение новостей
- Загрузка, распаковка и чтение книг NLS (на английском языке)
Организация информации
- Настройка календаря и установка необходимых напоминаний
- Организация контактов в адресной книге.
- Проверка орфографии, словарь и тезаурус (на 250000 слов)
- Увеличение рисунков, диаграмм и фотографий
- Печать, изменение размера и обрезка фотографий
- Калькулятор
- Мои Финансы (хранение до 10 различных счетов, баланс, отчеты и многое другое)
- Запись голосовых заметок
Является ли Dolphin Guide программой экранного доступа?
Несмотря на то, что Dolphin Guide озвучивает меню и опции на экране вашего компьютера, данное программное обеспечение не является полнофункциональной программой экранного доступа, такой как, например, JAWS for Windows. Dolphin Guide заменяет интерфейс Windows при помощи удобного меню, чтобы помочь пользователю в каждом его действии. Будь то написание писем, составление документов или просмотр веб-страниц — все это озвучивается Dolphin Guide, что подходит для большинства незрячих и слабовидящих пользователей, которые являются новичками в общении с компьютером.
- Dolphin Guide 9.04
- ТЗ на Dolphin Guide
- Рекламный проспект
- Аудио обзор
- Данное оборудование применяется для обеспечения доступности образовательного процесса незрячих и слабовидящих детей в учреждениях, реализующих программу «Доступная среда» и инклюзивную форму образования.
- Данное оборудование предназначено для профилактики инвалидности или реабилитации инвалидов по зрению. НДС не облагается согласно п. 27 ч. III Постановления Правительства РФ от 30 сентября 2015 г. № 1042 «Об утверждении перечня медицинских товаров, реализация которых на территории Российской Федерации и ввоз которых на территорию Российской Федерации и иные территории, находящиеся под ее юрисдикцией, не подлежат обложению (освобождаются от обложения) налогом на добавленную стоимость».
Источник: elitagroup.ru
Что такое гайд
Здравствуйте, уважаемые читатели блога Goldbusinessnet.com. Давайте продолжим знакомство со словами, имеющими иностранное происхождение и в качестве сленга прижившимися в рунете.
К уже рассмотренным ранее (это, например, и порядком надоевший хайп, и часто используемые акронимы РОФЛ и ЛОЛ, а также кек, троллинг) можно присовокупить термин «гайд», пришедший из английского языка, который многие используют как при переписке в сети, так и в устной речи. Изначально этот термин зародился в геймерской среде (именно геймеры его чаще всего и применяют), а уж затем постепенно распространился по всему интернету. В этой небольшой статье я постараюсь дать ему четкое определение, чтобы вы уяснили его суть.
Гайд — что это значит?
Собственно говоря, картина представляется довольно ясной. Английское слово «guide» имеет несколько довольно близких значений и на русский язык в качестве существительного его можно перевести как «путеводитель», «руководство», или «экскурсовод» (гид).
Вот ведь как разделились два близких понятия по произношению и написанию одного и того же английского термина русскими буквами (это не что иное как транслитерация в двух вариантах). Известный нам гид — это проводник или проводящий экскурсию (чаще всего живой человек).
А гайдом можно именовать инструкцию, относящуюся к любой области, где важно соблюдать корректность действий и системность, будь то пользование устройствами (бытовыми приборами, гаджетами, автомобилями, напичканными электроникой), управление игровой консолью либо создание сайтов. То есть, гайд вполне допустимо назвать «неодушевленным гидом».
Итак, гайд означает руководство или инструкцию, которая может быть представлена в разных вариациях. Главное, чтобы человек (обычно это начинающий пользователь) смог понять суть. Возьмем для примера любой информационный ресурс (да хоть этот блог), который содержит материалы по той или иной тематике, связанной с практическими действиями (по созданию сайтов, по ремонту квартир, по самостоятельному изучению языков и т.д.), от опытных (каждый в своей области) авторов. Почти каждая страница таких проектов является «гайдом на тему».
Гайды у геймеров
Я уже упомянул, что именно в геймерской среде этот термин приобрел наибольшую популярность. Ведь любая мало-мальски сложная игра вполне может вызвать у начинающего проблемы с ее прохождением, а потому требуются инструкции опытных игроков по тому или иному поводу.
Особенно сложно понять структуру игры с многочисленными персонажами, например, World of Warcraft, поэтому вовлеченные в нее свежеиспеченные геймеры постоянно ищут руководство по прохождению квестов, по выбору героя или стратегии для решения определенной задачи. Тот, кто по-настоящему поглощен игрой, может потратить кучу времени и «сжечь» немало нервов, когда что-то пошло не так, и он застрял на каком-то уровне, который преодолеть никак не удается. Чтобы сдвинуться с «мертвой точки», как раз и требуется помощь опытного геймера в виде ясного и пошагового руководства. На это ведь тоже способен не каждый, даже опытный, игрок. А потому качественные гайды среди геймеров в цене.
Заключительное слово о гайдах и инструкциях
Конечно, адепты чистоты родного языка, наверное, приходят в ужас от использования такого количества иностранных слов при наличии адекватных исконно русских синонимов. Однако, здесь ничего не поделать, законными методами запретить применение разного рода жаргонизмов не представляется возможным. Да и нужно ли это делать?
Ведь здесь все зависит от характера группы людей, которая использует тот или иной лексикон. Скажем, любое сообщество филологов наверняка придерживается строгих канонов, допускающих минимальное проникновение иноземных слов в речь или письмо (для них уж точно приоритетным является термин «руководство» или, на худой конец, «инструкция»). И напротив, молодежь при общении направо и налево щеголяет сленговыми выражениями («гайд» для них ближе). Каждому свое. А что вы думаете по этому поводу?
Источник: goldbusinessnet.com
Гайд — что это такое
Хочу продолжить тему трактовки популярных в сети слов, которые были заимствованы в основном из английского языка. Их часто используют, чтобы придать своим выражениям яркость и чутка загадочности.
Это и пресловутый хайп (уже набивший оскомину), или, например, троллинг от лица хейтеров. Это и перфекционизм, и хедлайнер, и хипстеры. Все это можно встретить в сети повсеместно.
Сегодня же хочу сказать пару слов про гайд. Слово это вполне себе хайповое и многие с легкостью его вставляют в свои мысли, выраженные буквами на экране или даже в устной речи. Что оно означает? Почему его чаще всего используют геймеры (кто это такие, надеюсь вы знаете)?
Что означает слово гайд?
Конечно же, хотелось бы в начале создать интригу, заинтересовать вас и плавно подвести к истинному значению этого слова. Но тут вообще не на чем интриговать. Все просто как две копейки. Есть такое слово в английском языке — Guide. Значений у него много, но основные — это руководство, мануал или путеводитель, который ведет или направляет кого-то.
Еще можно использовать созвучное слово — гид. Тут все понятно. Гид — это проводник по чему-либо (как правило, живой человек). Так вот, гайд — это тот же гид, но только не живой, а представленный в виде текстовой или видео инструкции (в пошаговом исполнении).
Допустим, вы купили бытовой прибор (достаточно сложный в управлении) и первое что вы делаете — начинаете изучать инструкцию о его применении (или хотя бы «быстрый старт»). Нет! Вы изучаете не инструкцию, а именно гайд. Вы от этого становитесь неимоверно крутым и значимым. Хотя, большинство открывают руководство по эксплуатации только после неудачного опыта, показать, что «тут и так все понятно».
Гайды составляются именно для начинающих (в большинстве случаев). В них передается максимально сжато и структурировано опыт другого, уже опытного в данном вопросе человека. В такой инструкции (справочнике для начинающего) стараются избежать возможных разночтений и заранее закладываются на то, что читать сей опус будут люди в данном вопросе априори (загодя) не сведущие.
Если вы каким-то непостижимым образом все-таки посмотрели на этом блоге еще несколько статей по разным тематикам, то, наверное, могли заметить, что он чуть ли не на половину состоит именно из таких вот гайдов. И было бы странно, если бы это было не так. Ведь блог называется КтоНаНовенького, а значит его основная аудитория приходит сюда именно за краткими пошаговыми инструкциями, помогающими быстро решить ту или иную возникшую проблему.
Вы сюда приходите, а я, как старательный гид, пытаюсь по мере сил вам показать все самое интересное по теме и донести эту информацию в понятной и, надеюсь, приятной форме. Понятно, что делай я это «в живую», то уже давно бы замучился до нельзя. А так — написал «гайд на тему», а вы уже приходите сюда с поисковика и с ним знакомитесь. А возникающие по ходу вопросы решаются через комментарии или переписку по почте. Красота!
Да, по сути все «статейники» (информационные сайты, а не те, где что-то продают) — это сборники гайдов разной степени качества и полезности. Чем больше пользы, тем больше посещаемость таких сайтов. Конечно же, таким образом вы не получите всей исчерпывающей информации, но у вас появятся ориентиры в какую сторону «копать» дальше.
Почему гайды так популярны в геймерской среде?
Кто играл (по-настоящему, с полным погружением в процесс), тот поймет всю наивность поставленного вопроса. Игра — это намного сложнее и важнее бытового прибора или какого-либо другого, якобы запутанного процесса, для описания которого нужна инструкция (пошаговая). Игра — это жизнь.
Неимоверно сложно и даже невозможно понять несведущему, как важно бывает добиться чего-то в Игре (пройти очередной уровень квеста, прокачать по полной персонаж в РПГ или максимально эффективно сыграть за орков в реал-тайм стратегии). На это тратится уйма времени и нервов. Забрасываются все дела «в реале», идет накал и выплеск невероятных эмоций.
Но далеко не у всех хватает сил пройти игру, используя только свои силы. Иногда затык возникает лишь в одном или двух местах, иногда «не идет вообще». Вот именно в этих случаях и нужны гайды по играм. Это могут быть и прохождения (т.е. пошаговое описание ваших действий для получения нужного результат), и схемы прокачки персонажей, и описания удачных стратегий, и способы найти все скрытые разработчиками ништяки. Все зависит от типа игры и ваших интересов в ней.
Гайды востребованы и их пишут те, кто уже накопил большой опыт в игре и готов им поделиться. Вы не будете искать в сети инструкцию на утюг, но будете искать прохождение игры, если застряли в каком-то месте и не можете сдвинуться дальше. Про утюг и так все понятно, а вот мир игры, который родился в «больной» голове разработчика, не всегда столь понятен и очевиден.
Вот примерно так я вижу то, что подразумевается под термином «неодушевленного гида». А вы что думаете?
Удачи вам! До скорых встреч на страницах блога KtoNaNovenkogo.ru
Эта статья относится к рубрикам:
Елена Глазкова
Супер! Статью прочитала с большим удовольствием, у меня зуд на новые словечки. Рада, что попала на ваш блог, много интересной информации и хорошо читается. Елена Дмитриевна.
Спасибо, доступное объяснение.
Да! Я тоже в восторге от очень доступного, легкого и подробного объяснения! Спасибо огромное! Мне понравилось у Вас! Действительно «Все просто, понятно и доходчиво. » Подписалась!
Спасибо за статью, познавательно и доходчиво. Подписываюсь
Иванова Мария
Пренебрежение к русскому языку не более
Ну да, сейчас игры самое главное и инструкции к ним, а раньше люди электросхемы искали, не в интернете конечно, а в журналах вроде Радио — деградация полным ходом.
Сейчас все кому не лень продают свои гайды: врачи — о лечении коронавируса, Верона — о борьбе с похмельем, считает себя экспертом, Самойлова — о косметике, крем за 70 тыс. советует. Теперь этот термин ассоциируется с инстамусором.
А по-русски, что сложно писать? Я противник всех иностранных слов. Почему? Потому что в русских словах уже заложен смысл и ответ. Например Путеводитель — уже все ясно, человек или кто-то, что-то, который показывает путь.
Мозги запоминают это слово и создаются разные ассоциации в картинках. Мозги сами начинают искать варианты движения. При слове гид или гайд в мозгах тишина. Поэтому молодежь тупеет.
Кроме игр мало чего изучают. «Гайд» не развивает мозготворчество. Новые словечки — это для распальцовки чаще всего. Не столько делают в этом направлении, типа создают что-то, а просто куда надо и не надо вставляют их, чтобы казаться продвинутым. Три мешка таких вижу и знаю. Одни поверхностные понты.
Я полностью согласна с Верой. Противно от этих гайдов, гаджетов, и т.п. Это какое-то языковое рабство. На фига писать и говорить гайд и тому подобные слова, в русском языке всё уже есть.
Ваш комментарий или отзыв
Источник: ktonanovenkogo.ru