family legends

Сервис хранения семейного древа и историй

Описание

Описание

Описание

Описание

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

Product Designer

Моя роль:

Product Designer

Моя роль:

Product Designer

Моя роль:

Product Designer

Моя роль:

Product Designer

Моя роль:

3 Weeks

Срок реализации:

3 Weeks

Срок реализации:

3 Weeks

Срок реализации:

3 Weeks

Срок реализации:

3 Weeks

Срок реализации:

Веб/мобильное приложение

Платформа:

Веб/мобильное приложение

Платформа:

Веб/мобильное приложение

Платформа:

Веб/мобильное приложение

Платформа:

Веб/мобильное приложение

Платформа:

2022 - 2023

Год:

2022 - 2023

Год:

2022 - 2023

Год:

2022 - 2023

Год:

2022 - 2023

Год:

К моменту начала работы у продукта была сильная идея, но несколько системных проблем:

  • сложная и разветвлённая концепция, непонятная новым пользователям,

  • недостаточное удобство, особенно в ключевых сценариях,

  • функции скрыты, несмотря на их богатство,

  • несогласованные интерфейсные решения в разных частях приложения.

Цель — вернуть продукту понятность, упрощение и фокус, не сломав текущие возможности.

Постановка задачи

Нам поставили задачу:

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

Понять кто основная аудитория, какие у неё входные сценарии

Спроектировать новый онбординг и навигацию, убрав фрустрацию на первых шагах

Подготовить концепт целевого редизайна приложения и сайта

Предложить структурные улучшения UX и UI, которые можно внедрять поэтапно

Параллельно нужно было провести анализ предыдущих итераций, чтобы избежать повторения ошибок.

Исследование

1. Аудит юзабилити

1. Аудит юзабилити

1. Аудит юзабилити

Icon

Отчёт по юзабилити-тестированию

Icon

Отчёт по юзабилити-тестированию

Icon

Отчёт по юзабилити-тестированию

Icon

экспертную оценку

Icon

экспертную оценку

Icon

экспертную оценку

Icon

Анализ сессий

Icon

Анализ сессий

Icon

Анализ сессий

Icon

Интервью с владельцем продукта

Icon

Интервью с владельцем продукта

Icon

Интервью с владельцем продукта

Выводы:

Выводы:

  • Пользователь не понимает, что именно делает приложение.

  • Пользователь не понимает, что именно делает приложение.

  • Путь входа запутан: везде требуются данные персон до того, как юзер узнает, зачем это нужно.

  • Путь входа запутан: везде требуются данные персон до того, как юзер узнает, зачем это нужно.

  • Главная страница перегружена, но при этом не показывает ключевые возможности.

  • Главная страница перегружена, но при этом не показывает ключевые возможности.

  • Онбординг не даёт интерактива — только текст и картинки.

  • Онбординг не даёт интерактива — только текст и картинки.

  • Не учтены разные типы пользователей (архивисты, любопытные, «хочу попробовать», приглашённые).

  • Не учтены разные типы пользователей (архивисты, любопытные, «хочу попробовать», приглашённые).

1. Аудит юзабилити

Icon

Отчёт по юзабилити-тестированию

Icon

экспертную оценку

Icon

Анализ сессий

Icon

Интервью с владельцем продукта

Выводы:

  • Пользователь не понимает, что именно делает приложение.

  • Путь входа запутан: везде требуются данные персон до того, как юзер узнает, зачем это нужно.

  • Главная страница перегружена, но при этом не показывает ключевые возможности.

  • Онбординг не даёт интерактива — только текст и картинки.

  • Не учтены разные типы пользователей (архивисты, любопытные, «хочу попробовать», приглашённые).

2. Анализ аудитории

2. Анализ аудитории

2. Анализ аудитории

2. Анализ аудитории

Собрали 8 основных сценариев входа — от новичков до пользователей, которые идут в существующую семью.

Собрали 8 основных сценариев входа — от новичков до пользователей, которые идут в существующую семью.

Выводы:

Выводы:

Выводы:

  • кто-то хочет создать историю → но видит “создайте персону”,

  • кто-то хочет создать историю → но видит “создайте персону”,

  • кто-то хочет создать историю → но видит “создайте персону”,

  • кто-то хочет посмотреть примеры → но их нет до регистрации,

  • кто-то хочет посмотреть примеры → но их нет до регистрации,

  • кто-то хочет посмотреть примеры → но их нет до регистрации,

  • кто-то вообще не понимает, что делает семейное дерево.

  • кто-то вообще не понимает, что делает семейное дерево.

  • кто-то вообще не понимает, что делает семейное дерево.

3. Анализ предыдущих подходов

3. Анализ предыдущих подходов

3. Анализ предыдущих подходов

Было два больших, но незавершённых подхода:

Онбординг через выбор направления (дерево, фото, истории, медиа).

Онбординг через выбор направления (дерево, фото, истории, медиа).

❌ проблема — новичок не видит весь функционал, а экраны-превью не решают непонимания.

❌ проблема — новичок не видит весь функционал, а экраны-превью не решают непонимания.

подход 1

Онбординг через быстрое «мини-дерево».

Онбординг через быстрое «мини-дерево».

❌ проблема — слишком много ввода на старте, высокая точка отказа.

❌ проблема — слишком много ввода на старте, высокая точка отказа.

подход 2

3. Анализ предыдущих подходов

Было два больших, но незавершённых подхода:

Онбординг через выбор направления (дерево, фото, истории, медиа).

❌ проблема — новичок не видит весь функционал, а экраны-превью не решают непонимания.

подход 1

Онбординг через быстрое «мини-дерево».

❌ проблема — слишком много ввода на старте, высокая точка отказа.

подход 2

Что было сделано
Что было сделано
Что было сделано
Что было сделано

Промежуточный редизайн

Наша задача — быстро улучшить UI и частично UX, не затрагивая архитектуру.

Наша задача — быстро улучшить UI и частично UX, не затрагивая архитектуру.

  • новая цветовая схема,

  • переработка главного экрана,

  • улучшение карточек и визуальной структуры,

  • частичное обновление сайта.

  • новая цветовая схема,

  • переработка главного экрана,

  • улучшение карточек и визуальной структуры,

  • частичное обновление сайта.

Ограничение: юзабилити менять было рано, так как целевая структура
ещё не сформирована.

Этот этап помог стабилизировать текущую версию продукта и подготовить базу под большие изменения.

Целевой этап: переработка онбординга и навигации

Основные проблемы, которые нужно решить

  1. У разных типов пользователей разные входные сценарии.

  2. Нужно показать функциональность до регистрации.

  3. Скрытые и плохо объяснённые возможности (фоторедактор, мед. раздел, совместная работа, права, комментарии).

  4. Главный экран не даёт понимания продукта.

Предложенные решения

Цель: показать все ключевые возможности, при этом не перегружая.

1. Новый главный экран

сеточная структура, как в Facebook / Яндекс Телемост

2. Онбординг на основе выбора мотивации

Не “заполните 3 персоны”, а сразу выбор цели

3. Демо-режим

Пользователь должен увидеть результат без ввода данных

1. Новый главный экран

сеточная структура, как в Facebook / Яндекс Телемост

2. Онбординг на основе выбора мотивации

Не “заполните 3 персоны”, а сразу выбор цели

3. Демо-режим

Пользователь должен увидеть результат без ввода данных

1. Новый главный экран

сеточная структура, как в Facebook / Яндекс Телемост

2. Онбординг на основе выбора мотивации

Не “заполните 3 персоны”, а сразу выбор цели

3. Демо-режим

Пользователь должен увидеть результат без ввода данных

1. Новый главный экран

сеточная структура, как в Facebook / Яндекс Телемост

2. Онбординг на основе выбора мотивации

Не “заполните 3 персоны”, а сразу выбор цели

3. Демо-режим

Пользователь должен увидеть результат без ввода данных

Материалы, использованные в работе

  • прототипы,

  • отчёты по юзабилити,

  • Miro-доски по аудитории,

  • предыдущие дизайн-системы,

  • реализованный редизайн.

Итог и следующая стадия

Сформирован новый подход к онбордингу, который:

Сформирован новый подход к онбордингу, который:

  • учитывает разные типы пользователей,

  • снижает точку входа,

  • показывает ценность до регистрации,

  • делает приложение понятным уже на первых шагах.

Дальше — этап крупного продуктового редизайна:

Дальше — этап крупного продуктового редизайна:

  • новый фреймворк навигации,

  • обновление структуры сущностей,

  • редизайн сайта и приложений,

  • проверка гипотез на тестах.

Редизайн веб версии

Обсудим?

Я открыт для новых проектов или просто для общения.

Обсудим?

Я открыт для новых проектов или просто для общения.

Обсудим?

Я открыт для новых проектов или просто для общения.

Обсудим?

Я открыт для новых проектов или просто для общения.

Обсудим?

Я открыт для новых проектов или просто для общения.

Create a free website with Framer, the website builder loved by startups, designers and agencies.