Как я пытался улучшать дизайн популярных сервисов и что это мне дало

12

Этот текст написан в Сообществе, в нем сохранены авторский стиль и орфография

Аватар автора

Магомедрасул Рамазанов

Страница автора

Когда я приступил к 30 дневному UI-челленджу, я поставил перед собой задачу не просто перерисовывать экраны популярных сервисов в Figma, а создавать их так, как я бы их спроектировал. Я решил не менять функциональность, а сосредоточиться на том, чтобы интерфейс выглядел более современно, красиво и с учетом актуальных дизайнерских трендов.

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

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

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

  • Скажи, ктоА как вы оцениваете сделали ли вы лучше или хуже?) Зачем, например, у Тинька убрали всю нижнюю панель, которой часто пользуются? «В результате, я научился создавать более визуально привлекательные и гармоничные интерфейсы.» Почему думаете, что интерфейсы стали лучше?6
  • little~witchПорой не понимаю любовь некоторых дизайнеров к огромным заголовкам и при этом мелкому шрифт для важной информации, как вот с кэшбэком в тиньке. Часто встречаю, может это и правильно, но хз. Акцент же сильно не на том:(0
  • DariaПервая работа: картинка функционала не несёт, но перетягивает внимание, белый текст на черном фоне хуже воспринимается глазом чем чёрное на белом, на кнопке (очень контрастной) появился голубой цвет, которого нигде нет. Если мне нужно зайти в чат с поддержкой или в другой раздел, то это куда нажимать?1
  • user5981751Скажи,, По-моему получилось не очень, но в любом случае это опыт. Видно человек новичок, надо бы прокачаться в ux0
  • ВеточкаСтало хуже1
  • Кристофер РобинКуда дели таб-бар? Если вы меняли только ui, то навигация должна сохраниться. Как с экрана карты попасть хоть куда-то еще?) Я б вот лучше убрала шкалу в плашке с операциями. Она тут ничего не дает, я ж не знаю, какой цвет что значит) предположу, что внутри раздела индикация описана. Вот там пусть и будет шкала, а на плашке только место занимает. Менять цвет праймари кнопки - ну такое. Это ж основной цвет бренда.0
  • Кристофер РобинВ Яблоке тоже цвета какие-то не их, тусклый оранжевый и депрессивный синий. У них кислотная палитра, этим и выделяются. Сокращение текста в кнопке до «Перейти» не обосновано. Куда я перейду непонятно, текст над кнопкой не поясняет. Потому «Перейти к подборке» очень логично.1
  • Кристофер Робинна третьем скрине (не знаю, что за приложение) - куда пропала кнопка «написать»?) полагаю, что она очень важна.0
  • Кристофер РобинРезюме: дизайн - это конечно хорошо, но функционал-то не забирайте у пользователей)0
  • ЗаказнойТ-анк Не корректно сравнивать макеты с разными темами. Это слишком сильно влияет на восприятие итогового результата. Сравнивать нужно только светлая/светлая и тёмная/тёмная. Непонятно зачем сломал навигацию, и накрутил ненужной стилизации (градиент в бордере). Золотое яблоко Указать разделы и поиск как основные элементы навигации, верное решение. Стало в целом аккуратнее. Стоило бы немного ещё поковыряться, чтоб убрать градиент по верх баннера. Подготовленный контент контрастирующий с текстом на переднем плане баннера, всегда смотрится дороже. В случае зя, это важно. Vc.ru Сдвинул акцент на навигацию по разделам, теперь там огромная синяя кнопка, из-за которой внимание постоянно улетает с ленты на левый верхний угол, зачем? Аккуратную Безблочку в ленте разбил на такие себе блоки, зачем? Чтобы что? Комментарии спрятал, чем уменьшил вовлечённость в контент... Аккуратные иконки из линий, сменил на заливку, тот же вопрос, зачем там акцент в виде дополнительной плотности? Про попытку сделать не круглые аватарки и уменьшить скругления у других элементов, вообще молчу. Upd, каждый раз когда принимаете решение внести какие-то изменения в макет, всегда задавайтесь вопросом, зачем я это делаю? Какая конечная цель? Увеличить вовлечённость в контент через первые комментарии под постом, Привлечь внимание к сторис или вести юзера до карточки с акцией. Всегда должна быть конечная цель, система и обоснование. Даже если это обоснование сделать свистоперделоку, чтоб развлечь юзера, "хайпануть" или привести его к каким-то определенным действиям.0
  • Тётушка ПоТэк-с. Я - старая тётка. Нас таких среди пользователей приложений немало. И если вдруг привычный светлый с понятными кнопками экран заменят вот этим вот чёрным с шишкой, я буду долго и мучительно долбить поддержку и требовать "вернуть как было". Темно-серое на чёрном тупо не видно, а неоновые розовые всполохи даже не дают глазу сосредоточиться на важном. Это ж не дискоклуба приложение, а банка. Мне оут цифры важны, а яих тупо не вижу. Чёрный фон - зло, яркие пятна - зло, дизайн вместо функционала - зло... Усё, ушла бухтеть на лавку1
  • МаксимКубышка -> Кубушка Зачем предлоги в конец строки обратно вернули? Их там не должно быть никогда и нигде. Зачем убрали жёлтую плашку, которая никогда не видна при использовании приложения?0
Вот что еще мы писали по этой теме