Здесь собрана первая часть заданий для UI практики, задачи здесь посвящены редизайну. Редизайн бывает разный, но всегда основан на уже существующих сервисах/сайтах. И здесь собраны лучшие для старта задачи и они разделены по уровню сложности: идем от самого простого к самому сложному.
Все эти кейсы я собрал и придумал сам, опираясь на личный опыт работы на фрилансе и доступные в открытом доступе ресурсы на просторах интернета (ссылки на источники, если они были использованы, вы найдете внизу этой страницы), поэтому используйте эти данные исключительно для тренировки своих навыков.
Перед тем как приступить к выполнению задач редизайна рекомендую ознакомиться со следующими материалами:
- "Как сделать редизайн приложения" от PurreWeb
Ещё задания для UI-практики
- 42+ дня UI-практики. Задания на каждый день. И ресурсы для поиска новых заданий (спойлер: можно делать не каждый день, а раз в 2-3 дня по одному экрану)
Кейс #1 - FindCoffeeShopNorway
Редизайн некоторых элементов веб-сервиса и создание одного нового виджета
Уровень сложности: Junior-помощник
Краткое описание задания: здесь вы познакомитесь с макетами рейтингового сервиса кофеен из Норвегии; вам не нужно повторять существующий функционал, перед вами стоит иная задача - внести изменения в макеты по четким инструкциям; думаю, такого рода задание должно втянуть вас в дизайн-процесс, а следующие задания пойдут на усложнение. Все требуемые правки и необходимые новые виджеты для сервиса вынесены в Google-документ. А сам проект, на основе которого вам требуется выполнить задание, вынесен в Figma. Тренируйтесь и втягивайтесь в дизайн-процесс, и если вам понравится, то доделывайте и переходите к следующему заданию.
Ссылка на проект в Figma: ссылка на проект
Ссылка на ТЗ в Google Documents: ссылка на документ
Кейс #2 - Instagram 2024
Редизайн визуальной части десктоп-версии Instagram
Уровень сложности: Junior-мечтатель
Описание задания: с вас не требуется проводить исследования и пытаться сделать дизайн приложения удобнее, с вас требуется лишь визуально обновить десктоп версию сайта Instagram. Отследите, что сейчас в трендах, и попытайтесь обновить несколько страниц десктоп-версии Instagram:
- Экран страницы профиля;
- Экран "Интересное";
- Экран воспроизведения Reels;
Данное задание направлено на тренировку отслеживания трендов и поиск вдохновения. Главная цель - сделать визуально красивый интерфейс. Все необходимые ресурсы предоставлены ниже. Функционал сохраните весь исходный.
Ссылка на сервис: Instagram
Могут понадобиться: плагин "html.to.design" в Figma (позволяет переводить существующие сайты в макеты в Figma)
Для поиска вдохновения: "28 сайтов для поиска вдохновения веб-дизайнерам"
Кейс #3 - Ваш любимый продукт
Редизайн функционала сервиса
Уровень сложности: Junior-Middle
Краткое описание задания: Здесь вам предстоит самая масштабная работа по редизайну из всех на этой странице. Все изменения вы определяете сами. Важно, чтобы вы выбрали для этого задания свой любимый сервис. Потому что вы лучше всего знаете недостатки тех сервисов, которые используете сами. В этом задании вам предстоит выступить сразу в двух ролях: и в роли пользователя и в роли дизайнера. Как пользователь, сформулируйте все главные недостатки сервиса и запишите их. А потом в роли дизайнера придумайте решения и отобразите их в макетах. И придумайте один виджет/функцию, которой вам очень не хватает и появление которого улучшило ваше восприятие продукта (будь то голосовой помощник или AI-ассистент, а лучше придумайте именно то, что необходимо вам самим).
План действий редизайна: ссылка на google документ
Ещё задания для UI-практики
- 42+ дня UI-практики. Задания на каждый день. И ресурсы для поиска новых заданий (спойлер: можно делать не каждый день, а раз в 2-3 дня по одному экрану)
Всем спасибо за внимание!
Данная статья была написана специально для телеграм-канала "Айрат о дизайне"