Принципы дизайна: как работает дизайн

Внутри:
– Роль принципов дизайна в эстетической целостности
– Визуальная иерархия
– Интервалы, выравнивания, сетки
– Баланс
– Контраст
– Симметрия
– Повторение
– Правило нечетных чисел
– Силовые линии
– Масштаб и пропорции
– Расстановка акцентов
– Цлостность
– Близость
– Согласованность
– Цвет
– Типографика
– Негативное пространство

👉 Читать статью

———

@jun_hi
@jun_hi_vacancies

Интересная статейка, как Ситимобил менял форму регистрации у себя в сервисе.

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

👉 Читать кейс

———

@jun_hi
@jun_hi_vacancies

Один вопрос

Давайте представим, что вы нанимаете дизайнера в команду. Вы долго его искали, отклонили больше 1000 откликов и вот он на собеседовании.

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

Какой бы вопрос это был?

———

@jun_hi
@jun_hi_vacancies

👾 Inspiration #5

Подборка лендингов и сайтов для вдохновения на предстоящую неделю 🔥

– https://primer.io/
– https://snapcall.io/
– https://peachaus.com
– https://engage.so
– https://www.xref.com

———

– https://re-store.io
– https://flambette.com
– https://www.unikorns.work
– https://www.shopify.com/pos/pos-go
– https://atoms.com

———

– https://www.superfluid.finance
– https://www.remo.health
– https://www.awwwards.com
– https://tracky.so
– https://tana.inc

———

– https://www.aircompany.com
– https://linear.app
– https://handlagrocerylist.app
– https://frame.io
– https://dub.sh
– https://www.redis.agency
– https://kilo.ai
– https://madebywater.com

———

@jun_hi
@jun_hi_vacancies

Ребята из INLY поделились ссылочкой на их базу знаний

Внутри:
– 170+ статей про дизайн (исследования, руководства, гайды и прочее)
– Иконки
– Шрифты
– Работа с цветом
– Плагины для Фигмы
– Дизайн-системы
– Редактура и текст
– Инструменты аналитики
– Паттерны
– Онлайн-приложения
– Полезные сервисы

А ещё 14 полезных книг.

👉 Забирайте

———

@jun_hi
@jun_hi_vacancies

Статья про модалки. Как размещать, что делать со скроллом и другие полезные моменты, которые можно учитывать в своих дизайнах.

Внутри:
– Что такое модальное окно
– Как и когда используется
– Анатомия компонента
– Размеры и отступы (ширина, высота)
– Шапка и подвал окна
– Как располагать на странице
– Появление
– Поведение при прокрутке
– Переключение объектов
– Заголовок
– Закрытие модалки
– Стилизация
– Работа с клавиатурой

👉 Читать статью

———

@jun_hi
@jun_hi_vacancies

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

1. «Не заставляйте меня думать. Веб-юзабилити и здравый смысл», Стив Круг

2. «Интерфейс. Основы проектирования взаимодействия», Алан Купер, Кристофер Носсел, Дэвид Кронин, Роберт Рейман

3. «Психбольница в руках пациентов. Алан Купер об интерфейсах», Алан Купер

4. «Пользовательский интерфейс. Электронный учебник», Илья Бирман

5. «Интерфейс. Новые направления в проектировании компьютерных систем», Джеф Раскин

6. «Дизайн пользовательского интерфейса². Искусство мыть слона», Влад Головач

7. «Как создать продукт, который полюбят. Опыт успешных менеджеров и дизайнеров», Скотт Хёрф

8. «100 новых главных принципов дизайна. Как удержать внимание», Сьюзан Уэйншенк

9. «Дизайн пользовательского опыта. Как создать продукт, который ждут», Джон Уэлен

10. «Модульные системы в графическом дизайне. Пособие для графических дизайнеров, типографов и оформителей выставок», Йозеф Мюллер-Брокманн

11. «Спроси маму: Как общаться с клиентами и подтвердить правоту своей бизнес-идеи, если все кругом врут?», Роберт Фитцпатрик

12. «Дизайн привычных вещей», Дональд Норман

13. «Дизайн-мышление в бизнесе», Тим Браун

14. «User Friendly», Cliff Kuang

15. «Refactoring UI», Adam Wathan & Steve Schoger

———

@jun_hi
@jun_hi_vacancies

Архивный файл сотрудников Фигма, где они рисовали разные варианты иконки основного и дочернего компонента) В итоге сделали то, что есть сейчас.

Как вам варианты? Мне вот первый нравится тоже 😂

———

@jun_hi
@jun_hi_vacancies

Статья про призыв к установке мобильного приложения на вашем сайте с 76 примерами и разбором плохих кейсов

Внутри:
– Как размещать блок
– Призыв к действию
– Highlight приложения
– Лендинг приложения
– Кнопки сторов
– QR-код
– Целевые страницы

👉 Читать статью

———

@jun_hi
@jun_hi_vacancies

Во Вконтакте есть комментарии. Сейчас, наведя на один из комментов как админ паблика, я увидел ДВА крестика, абсолютно одинаковых.

Но у них разный функционал. Как думаете, какой? Один лёгкий, а вот второй)))

Самое удивительное, что кто-то согласовал такой дизайн. То есть разработчики, продакты и лид дизайна сказали «Супер, давайте в прод»

———

@jun_hi
@jun_hi_vacancies

Сегодня видимо день не мой. Оформляю вызов курьера сдэк, все заполнил. Проверил на 82 раза. Кнопка к получателю неактивна. Никаких ошибок, подсказок. Ничего.

Ну вот как((( пришлось оформлять с приложения.

У меня есть знакомый товарищ, Эльдар. Он работал продуктовым дизайнером в Wargaming, а сейчас делает новый шутер.

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

Вакансии публикуются раз в сутки полноценной подоборкой со страной релокации и самой вакансией с описанием. В текущее время очень актуально для всех.

Медлить не нужно, залетайте в канал, возможно когда-то он вам поможет)

👉 Подписаться
👉 Подписаться
👉 Подписаться

👾 Inspiration #6

Подборка лендингов и сайтов для вдохновения на предстоящую неделю 🔥

– https://carta.com
– https://www.withcoherence.com
– https://www.nftparis.xyz
– https://mojo.shop
– https://www.composer.trade

———

– https://detail.co
– https://ignite.com
– https://halon.io
– https://www.agildedleaf.com
– https://www.demostack.com

———

– https://devrev.ai
– https://www.docestudio.fr
– https://www.socialhouseinc.com
– https://rpcfast.com
– https://duffel.com
– https://motionapp.com

———

– https://foundation.app/drops
– https://www.empathy.com
– https://m3.material.io
– https://www.remento.co
– https://postevand.com
– https://capital.xyz
– https://www.anron.pro

———

@jun_hi
@jun_hi_vacancies

🇬🇧 Отличная статья от Виталия Фридмана с примерами о том, как спроектировать динамическую валидацию форм

Внутри:
– Какие перимущества
– Недостатки
– Правила проектирования
– Кейсы динамической проверки с описанием
– Выводы

👉 Читать статью

———

@jun_hi
@jun_hi_vacancies

Если прямо сейчас Фигма упадёт на 2 дня, чем займетесь?

Figma запускает разделы

Не знаю зачем, пока не понял) Условно это такой же фрейм, который можно настраивать по цвету и давать ему статусы.

Но пока не вижу поддержки AL для более организоваанного порядка внутри раздела.

Кажется, тоже самое можно сделать, создав обычный фрейм и засунув туда экраны))

Объясните, кто понимает, что это может быть и зачем)

У меня появилось во вкладке, где Frame.

Все изменения, которые фигма дропнула сегодня: https://www.figma.com/whats-new/

Тут подробнее про разделы: https://help.figma.com/hc/en-us/articles/9771500257687

———

@jun_hi
@jun_hi_vacancies

Ты UX/UI дизайнер? 👾

Присоединяйся к онлайн-митапу UX\UI in Social Discovery и узнай о последних трендах веб-дизайна от ведущих экспертов глобальных IT компаний: Social Discovery Ventures и EPAM Systems.

На митапе мы обсудим:

▪️ Как протестировать концепт всего за 1000$ и понять аудиторию?
▪️ Что нужно знать о разработке Social Life 3.0?
▪️ Как использовать NFT в продуктах Social Discovery?

💻 27 октября, 19:30. Будет запись онлайн-трансляции.

Участие бесплатное по предварительной регистрации — переходи по ссылке

Небольшая статья о том, как писать тексты для экранов подтверждения

Внутри:
– Когда нужен экран подтверждения
– Как писать заголовок и описание
– Как называть кнопки
– Примеры как правильно и нет

Вроде очевидные и простые правила, но каждый день сталкиваюсь с тем, что их не соблюдают. Кнопки отменить и отмена рядом стоящие есть у Apple 🌚🌚

👉 Читать статью

———

@jun_hi
@jun_hi_vacancies

Задачка
Вы устроились в компанию логистики на внутренние интерфейсы сотрудников, которыми пользуется 15.000 человек.

Система, которой пользуются делалась еще в далеком 2008 году и за 14 лет выросла в огромную машину с тысячей функций, ролевыми моделями сотрудников итд. Но, все делалось давно, без дизайнера и силами разработки на стандартных фреймворках.

И вот руководство решило все это дело улучшить. Сделать современный дизайн, убрать все ненужное с 2008 года, продумать новый пользовательский опыт.

И взяли вас на эту задачу, пока что как единственного дизайнера.

Как будете действовать? Как подойдете к решению такой задачи?

Давайте думать 👇👇👇

———

@jun_hi
@jun_hi_vacancies

👾 Inspiration #7

Подборка лендингов и сайтов для вдохновения на предстоящую неделю 🔥

– https://nextjs.org
– https://designmodo.com/startup/
– https://www.folk.app
– https://www.wilsoncreative.se
– https://www.brex.com

———

– https://www.hypercomply.com
– https://www.belkadigital.com
– https://www.apeel.com
– https://www.agildedleaf.com
– https://www.paytient.com

———

– https://ruti.life
– https://flodesk.com
– https://www.palantir.com
– https://www.armadillo.one
– https://www.raycast.com

———

– https://www.getcoco.com
– https://evilmartians.com
– https://www.yumeibrand.com
– https://typefully.com
– https://vercel.com/analytics

———

– https://www.iconosquare.com
– https://odins-crow.com
– https://www.thecraftsmen.tech
– https://anytype.io
– https://tr.af

———

@jun_hi
@jun_hi_vacancies

Как команда Сбера делала редизайн ЕАПТЕКИ

Внутри:
– Зачем он был нужен
– Определение целей редизайна
– Начало разработки новой версии
– Исследование клиентского пути
– Пересмотр механизма оформления заказа
– Планирование разработки
– Адаптация промо-страниц
– Тесты новой версии
– Запуск

👉 Читать статью

———

@jun_hi
@jun_hi_vacancies