Shelter app
Мобильное приложение и вебсайт
ЯНВАРЬ - МАРТ 2023
Shelter app
Из-за различных факторов людям может быть тяжело или неудобно посещать приют для животных, чтобы посмотреть потенциальных питомцев или получить необходимую информацию об усыновлении питомца.
Мне предстояло создать дизайн, который помог бы пользователям избежать возможных трудностей, с которыми они могут столкнуться при поиске домашнего животного.
Процесс разработки
  • 1
    Понять пользователя
    • Исследование пользователей
    • Персоны пользователей
    • Формулировка проблем
    • Карты путешествия пользователей
    • Исследование конкурентов
  • 2
    Генерация идей
    • Маршрут пользователя
    • Бумажные наброски (вайрфреймы)
    • Цифровые вайрфреймы
    • Низкодетализированный прототип
    • Юзабилити - тестирование
  • 3
    Доработка дизайна
    • Высокодетализированные мокапы
    • Прототип
    • Соображения доступности
    • Создание сайта
Исследование пользователей
Так как это учебный проект, у меня не было доступа к реальным исследованиям и интервью.
Я выбрала четырех вымышленных пользователей и представила, как они будут отвечать на заданные мной вопросы. Основная группа пользователей, выявленная в ходе исследования - работающие взрослые, желающие завести домашнее животное.
Исследования показали, что личные убеждения, финансы и различный опыт респондентов делают более предпочтительным усыновление питомца из приюта, нежели его покупку.
Исследования также выявили такие проблемы пользователей, как обязательства или личные обстоятельства, которые не позволяют лично посетить приют для животных.
Болевые точки:
1
Работающие взрослые не имеют достаточно времени, чтобы посещать различные приюты один или несколько раз.
Время
2
Не все приюты оборудованы для людей с ограниченными возможностями, поэтому удобнее проверить всю информацию заранее перед посещением.
Доступность
3
Людям, заводящим питомца впервые, заранее нужна информация об уходе, необходимых документах и требованиях, чтобы обдумать решение. Также некоторые люди хотели бы поддержать приюты пожертвованиями, но не знают, как это сделать.
Информация
Персоны пользователей
«Как гордый обладатель двух прекрасных кошек, я всегда говорю: «Приюти, а не покупай». Было бы здорово, если бы все животные нашли любящий дом и получали заботу, которую они заслуживают».
«Завести собаку — это большая ответственность. Мне определенно нужно подготовиться к этому, чтобы создать наилучшие условия для питомца».
Марио живет в Загребе и работает ведущим графическим дизайнером в крупной фирме в центре города. За пять лет успешной работы он всего несколько раз брал отпуск. Он увлечен своей работой, но ему трудно справляться со стрессом, и иногда он чувствует себя одиноким, поскольку живет один. Он хотел бы вести более активный образ жизни и проводить больше времени на природе.
В детстве Марио мечтал о собаке, и сейчас снова задумался об этом, но для него это серьезное решение, требующее подготовки.
Марио
Ивана живет в пригороде Загреба с дочерью-подростком и создает витражи в своей домашней мастерской. У них есть две кошки, которых они подобрали на улице еще котятами. Когда дочь поступит в университет, Ивана, скорее всего, заведет еще одного питомца.
Когда у Иваны и ее дочери появляется возможность, они работают волонтерами в местном приюте для животных. Из-за состояния здоровья Иване становится трудно работать физически, поэтому она хочет найти способ помочь удаленно, но у местного приюта для животных пока даже нет сайта или приложения.
Ивана
Разочарования:
  • Разочарована тем, что многие люди не знают о том как важно брать животных из приюта;
  • Расстроена тем, что не у всех приютов для животных есть веб-сайт или приложение.
Цели:
  • Хочет помогать людям усыновлять животных;
  • Хочет найти способ помочь приютам для животных онлайн.
49
Бакалавр искусств
Пригород Загреба
Разведена, живет с дочерью-подростком
Художник витражист
Возраст:
Образование:
Родной город:
Семья:

Занятие:
28
Бакалавр дизайна
Загреб, Хорватия
Холост, живет один
Ведущий графический дизайнер
Возраст:
Образование:
Родной город:
Семья:
Занятие:
Разочарования:
  • Разочарован тем, что не у всех приютов есть веб-сайт или приложение;
  • «У меня нет машины, чтобы легко посещать приюты в разных частях города, было бы здорово делать это прямо из дома».
Цели:
  • Хочет иметь друга-питомца, с которым можно проводить время;
  • Хочет быть более активным и проводить больше времени на природе.
Постановка проблем
  • 1
    Эланора — работающая мама двоих детей, которая хочет найти новые способы помочь сохранить окружающую среду, потому что физически она больше не может работать волонтером.
  • 2
    Аарон — студент, которому хотелось бы иметь приложение для спасения океана и его обитателей, которое объединит его с такими же людьми, как и он.
Карта путешествия пользователя: Марио
Цель: найти своего домашнего питомца в приюте для животных.
Маршрут пользователя
Бумажные и цифровые вайрфреймы
В процессе рисования вайрфреймов я старалась сделать так, чтобы дизайн был направлен на решение болевых точек пользователей.
Для начала я решила разместить основные функции приложения на главном экране, чтобы пользователю было проще ориентироваться.
Также в приоритете был удобный и простой поиск по базе питомцев приюта.
Этот элемент позволит пользователю добавить профиль питомца в «избранное», чтобы вернуться к нему позже.
Элемент, позволяющий пользователю легко и интуитивно настроить поиск.
Этот элемент позволит пользователю быстро просматривать приложение и находить то, что ему нужно, без создания учетной записи, которая может ему не понадобиться.
Этот элемент позволит пользователю быстро просматривать приложение и находить то, что ему нужно, без создания учетной записи, которая может ему не понадобиться.
Элемент, позволяющий пользователю легко и интуитивно настроить поиск.
Этот элемент позволит пользователю добавить профиль питомца в «избранное», чтобы вернуться к нему позже.
Lo Fi прототип
Прототип показывает путь пользователя, который ищет питомца, затем находит его и записывается для посещение приюта.

Ссылка на прототип.
Юзабилити - тестирование
Я провела немодерируемое исследование юзабилити с пятью вымышленными участниками, в результате которого получила следующие результаты:
Можно добавить основные категории домашних животных на экране поиска для удобства пользователя.
Добавить кнопку «увидеть больше» в анкеты питомцев в поиске, чтобы было понятнее пользователю.
Добавить функцию уведомлений с напоминаниями и возможностью их отключения.
Результаты 2-го круга тестирования
2
3
1
Результаты 1-го круга тестирования
Не все могли понять, где найти опцию смены языка.
Большинству пользователей не сразу понятно, как записаться на прием.
Для некоторых пользователей кнопка «explore» не очевидна.
1
2
3
UI дизайн
Перед созданием мокапов я подобрала палитру цветов, шрифты, придумала логотип для Приюта и нарисовала милую картинку для страницы входа.
Hi Fi мокапы
После проведения исследования юзабилити я сделала кнопку «explore» более заметной и понятной для потенциального пользователя. Также я поместила настройки приложения в отдельную категорию на главном экране, чтобы пользователи могли легко их найти.
После тестирования
До юзабилити тестирования
После тестирования
До юзабилити тестирования
Второе исследование юзабилити показало, что страница «make an appointment» перегружена.
Также проверка цвета на соответствие стандартам доступности выявила недостаточную контрастность, в результате чего я изменила выбор цветов для некоторых элементов.
Hi Fi прототип
Окончательный высокодетализированный прототип показывает более четкие пользовательские потоки для поиска домашнего животного и записи для посещения приюта.

Соображения доступности:
  • Использованы иконки с подписями, чтобы сделать навигацию более четкой.
  • Цветовая палитра приложения в соответствии со стандартами доступности.
  • Подробное описание каждого питомца в их профилях для удобства пользователей.
  • Вся информация также может быть считана скринридерами.
Создание сайта
Закончив создание дизайна мобильного приложения, я взяла то, что узнала о своем продукте и пользователях, и применила это для разработки адаптивного веб-сайта.
Для начала я узнала о важности информационной архитектуры и создала карту для своего веб-сайта. Я создала вайрфреймы на бумаге и в цифровом виде для экранов разного размера, разработала прототип с низкой точностью и протестировала его с помощью юзабилити-исследования. Затем я перешла к высокодетализированному дизайну и создала мокапы для экрана компьютера.
Наконец, я создала прототип веб-сайта Shelter.
Выводы
При разработке Shelter и FishSave я поняла, что первоначальные идеи и макеты приложения — это только начало процесса. Юзабилити-исследования и отзывы однокурсников влияли на каждую итерацию дизайна приложений.
Благодаря данным проектам я научилась создавать простые и гибкие потоки пользователя, узнала о важности информационной архитектуры, улучшила свои навыки работы в Figma и Adobe Illustrator.
Следующим шагом в реальном проектах был бы еще один раунд юзабилити - исследований, чтобы проверить, были ли эффективно устранены болевые точки, с которыми столкнулись пользователи.
Спасибо за просмотр!
Благодарю вас за то, что вы нашли время, чтобы ознакомиться с моей работой.
Буду рада получить от вас обратную связь!

Phone: +7 (915) 056-21-80
Email: vrlmva@mail.ru
Made on
Tilda