Описание

Приложение MicroMinds для создания голосовых заметок для iOS(можно адаптировать под Android) 

Первый экран встречает нас легким градиентом и появляющимся лого (scale), затем, по очереди, всплывают заметки приветствия(translate,opacity,spring-curve), смещая лого вверх и побуждают к созданию аккаунта. Аккаунт позволяет синхронизировать записи, хранить их в облаке, а также позволяет с помощью machine-learning анализировать голос и распознавать его лучше с каждым разом. Однако, приложением можно пользоваться и без аккаунта для тех, кто не хочет оставлять свои личные данные.

Кнопки регистрации и входа в аккаунт outline, при ховере заполняются solid white.

Регистрация и вход имеют стандартный вид. В качестве альтернативы можно войти через соц.сети

Главный экран приложения представляет собой ленту созданных голосовых заметок. Навигация осуществляется при помощи 5-ти компонентного таббара:

Домой - Главный экран приложения

Поиск - Поиск заметок

Запись - Создание голосовых заметок

Избранное - фильтр по избранным заметкам

Аккаунт - настройки аккаунта и доступа к хранилищу

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

Сами заметки выполнены в виде карточек, на которых, по желанию пользователя, могут быть отображены дата и теги. Если текст не помещается в карточку, то карточка отображается с 3-мя точками в правом нижнем углу.

При длительном нажатии появляется меню, в котором добавить заметку в избранное, воспроизвести или удалить.

В feature-list приложения также включен поиск заметки. Снизу представлена кастомная строка поиска, сверху - стандартная iOS.

При зажатии микрофона появляется экран записи, от микрофона исходят волны в виде концентрических колец, которые при удалении от микрофона увеличиваются в размере и теряют в непрозрачности. Вверху экрана анимируется диаграмма. В настройках можно выключить опцию Hold to Record и тогда не нужно будет постоянно зажимать кнопку - это удобно при длительных сессиях.

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

При воспроизведении заметки можно переключаться между внутренним и внешним динамиками.

В настройках можно выводить дату заметки, управлять аккаунтом, изменять размер показываемого в заметке текста, покупать место в облаке (это MVP настройки, в ходе дальнейшего исследования их список может расшириться).

Работа была выполнена в Sketch. Вместе с созданием UI-кита и описанием ушло около 9 часов. Макет подготовлен к экспорту во Framer для создания анимированного прототипа. Жду ваших замечаний, предложений, вопросов!