Привет всем. Помните, в прошлом году Figma представила значительное обновление, благодаря которому стало возможным создавать полезные переменные для реализации темной и светлой версий интерфейса. В этом руководстве я поделюсь, как это сделать просто и эффективно. Для наглядности я специально использовал несовершенный подход, чтобы показать потенциальные ошибки, на которые вы могли бы нарваться. Начнем.
Интерфейсы *
То, что помогает ориентироваться
Как прокачивать насмотренность в UX для дизайнера интерфейсов (личный опыт)
Хочу поделиться своим опытом и рассказать, как я прокачиваю насмотренность в ux (не ui). Надеюсь, это кому-нибудь поможет.
Гайд по работе с ветками (Figma Branch)
Figma Branch (или «ветка») — это функционал, который позволяет создать копию проекта и изменять его независимо от основной версии. Когда работа завершена и нужно внести изменения в основной проект — ветка сливается с master-версией. Всё как у разработчиков. Но чтобы использовать Branch, ваш тариф должен быть Organization или Enterprise.
Предпосылки
При коллективной работе над проектом, всегда встречаются классические проблемы: что/когда/кем было добавлено в проект и почему компоненты сломались. Я часто видел костыльное решение — складывать готовые экраны и компоненты куда-то в угол канваса, тегать лида комментом, а после ревью — чистить за собой, мрак. Проще, быстрей, дешевле использовать функционал Branch, тем более они идеально подходят для следующих сценариев:
Как располагать элементы игровых интерфейсов
Правильное расположение элементов игрового интерфейса помогает людям решать задачи, которые мы перед ними ставим
В статье примеры подходов и решений, которые упрощают жизнь игрокам =)
Истории
Как я проектирую интерфейсы
Привет, я Егор Камелев, проектировщик интерфейсов (UX-дизайнер). За последние 20 лет я поработал с командами десятков агентств, IT-отделов, действующих проектов и продуктов, стартапов (и запущенных, и незавершённых). Я знаком с сотней команд, не меньше. И среди них не нашлось и двух, использующих одинаковые подходы к работе. Верно говорят: «У каждого додика — своя методика!».
У всех свои названия должностей, артефактов, процессов. Свои требования и наборы компетенций. Где-то проектированием занимается маркетолог и разработчик (потому что в команде больше никого и нету), а где-то эта задача распределена между десятью разными специалистами (системные- и бизнес-аналитики, технические писатели, UX-дизайнеры, продакт оунеры и так далее).
Поэтому в этой статье я не буду заявлять, что мой подход к работе — единственно верный. Он один из тысяч и в моём случае прекрасно работает: клиенты не заваливают меня правками, платят 100% предоплату и рекомендуют окружающим. Я распишу во всех деталях свой процесс предоставления услуги проектирования (создания интерактивного прототипа информационной системы на заказ). Уверен, что многим пригодятся мои знания. Погнали!
Я стал зарабатывать вдвое больше, когда начал писать техническую документацию
Речь идёт о функциональных спецификациях к сайтам, приложениям и прочим информационным системам.
В начале карьеры UX-дизайнера я просто делал интерактивные прототипы, а документацию предпочитал не писать. Почему так:
Во-первых, сложно. Этому навыку никто не обучал, а написать 100 и более страниц текста по проекту — это как диссертацию накатать. Поэтому я говорил клиентам, что, мол, и так справитесь.
Во-вторых, у меня не было опыта в роли заказчика. И только после того, как я на собственном проекте увидел, сколько денег экономит этот документ, стал предлагать его каждому новому клиенту.
Продавать это было легко. Достаточно было рассказать о том, как я, заплатив несколько десятков тысяч за документ, экономил несколько сотен тысяч на разработке. И подкрепить рассказ конкретными цифрами и примерами. Чаще всего я рассказываю о том, как пожалел 50к на функциональную спецификацию на участок собственного проекта, и разработчики делали его два с половиной месяца вместо привычного одного. А месяц их работы обходился моей казне почти в 300к рублей. И если бы я не сэкономил на функциональной спецификации, то задача обошлась бы на 400к рублей дешевле.
UX-мракобесие
UI/UX дизайн, UX-исследования, UX-стратегия, UX-копирайтинг, UX-команда, UX-маркетинг, бренд-экспириенс, AX-algorithmic experience, Client / Customer experience. Вам не показалось, что засилье новых терминов и дисциплин намекает на то, что UX — это не просто конкретный этап разработки или специализация, а нечто большее? Может Дон Норман был прав, определяя UX как «подход через опыт» к управлению продуктом, который охватывает «буквально все»?
Руководство по проектированию интерфейсов с Drag and Drop
Всем привет! Меня зовут Александр Григоренко, я фронтенд-разработчик, и я часто сталкиваюсь с разработкой веб-интерфейсов с использованием Drag and Drop. В своей предыдущей статье про Drag and Drop я рассказывал про историю появления и развития этого подхода: появившись в первом в мире графическом интерфейсе, Drag and Drop продолжает быть одной из самых актуальных технологий и на сегодняшний день. В этой статье я хочу поговорить об особенностях проектирования дизайна и юзабилити интерфейсов с Drag and Drop. В первую очередь, я буду приводить примеры и говорить об особенностях Drag and Drop в рамках сложившихся практик в современных веб-интерфейсах, но многое из этого будет справедливо и для интерфейсов классических настольных приложений.
Figma to Frontend: как мы автоматически синхронизируем дизайн и код
Меня зовут Анастасия Кабалкина, я Head of design в VK Tech. В этой статье расскажу, как мы синхронизировали треть нашей дизайн-системы за счет автоматической генерации дизайн-токенов и компонентов.
Библиотека контролов для Avalonia UI
Последний год наша команда работала над кроссплатформенной версией САПР Delta Design. В результате этой работы была создана своя библиотека UI контролов для Avalonia, которая поддерживает как ОС Windows, так и ряд систем Linux, включая российские АстраЛинукс, РедОс, а также их модификации под Эльбрус.
Создание единой библиотеки контролов EremexControls.NET позволило компании ЭРЕМЕКС значительно ускорить темпы разработки и показать мультиплатформенную версию САПР Delta Design раньше обещанного срока. Применение готовых типовых блоков дало возможность инженерам фокусироваться на предметной области, не отвлекаясь на другие задачи. Сейчас библиотека контролов используются в трех внутренних проектах компании.
Под катом обзорная статья по новому продукту от компании ЭРЕМЕКС – библиотека компонентов EremexControls.NET для Avalonia UI.
Без углов и стресса: Формула успешного дизайна, или как правильно скруглить внутренние углы фигур
Если вы новичок в дизайне, то наверняка могли заметить, что мелочи часто играют большую роль при создании композиции. Одна из таких мелочей – внутренние углы. В данной статье я рассказал, почему они важны и как сделать так, чтобы ваше закругление углов выглядело аккуратно.
Приложения для Vision Pro выглядят скучно
Apple вложила массу усилий в разработку правил, советов и руководств по проектированию элементов интерфейса, чтобы не столкнуться с подводными камнями, связанными с созданием 3D-интерфейсов. Это помогло избежать обилия подвижных элементов и визуального беспорядка, которые могут запутать пользователя или даже повлиять на его самочувствие.
Однако это привело к тому, что многие приложения, которые я видел, были без своего характера. Скриншоты кажутся безвкусными, а отличить одно приложение от другого становится затруднительно.
История Drag and Drop: от первого в мире графического интерфейса до современного веба
Всем привет! Меня зовут Александр Григоренко, я фронтенд-разработчик, и в последнее время я много работаю над веб-интерфейсами с возможностью перетаскивания объектов методом Drag and Drop. В процессе изучения стандартов и сложившихся лучших практик работы с этим подходом, мне стало интересно разобраться в истории его появления. Копнув поглубже, я выяснил, что Drag and Drop — это один из самых первых способов взаимодействия человека с компьютерной программой. В этой статье хочу рассмотреть историю появления и развития этой технологии.
Ближайшие события
Что качать дизайнеру в 2024: 7 востребованных навыков на рынке
Эта статья для тех, кто хочет оставаться на волне прогресса, а не оказаться погребённым под нею.
О чём поговорим:
1. Как делать дизайн для ИИ, и кто делает его сейчас?
2. Для чего дизайнеру разбираться в цифрах?
3. Зачем учиться рассказывать истории?
4. Как изменилось 3D, и почему его нельзя игнорировать?
5. Чем топовые приложения отличаются от хороших?
6. Как генеративная графика перестала быть развлечением?
7. Какого дизайнера возьмут на работу в первую очередь?
Как обновляют интерфейсы банкоматов и как это недавно сделали мы
Всем привет! Недавно мы переработали интерфейс наших банкоматов. Не то чтобы старый работал плохо, просто изменения — развитие, а развитие — это всегда хорошо. Рассказываем, что и как поменяли, как к этому пришли, что из этого вышло и зачем вообще обновлять то, что и так работает.
Что можно улучшить в приложении? часть 2. Крадем как художники у Lamoda
Продолжаем серию публикаций по улучшению юзабилити мобильных приложений. Сегодня сравниваем лидера рынка, самописное и на конструкторе. Делимся, что можно позаимствовать из Lamoda и какие ошибки совершают разработчики.
Выбор размера
Выбор подходящего размера – стрессовый момент при заказе одежды в интернет-магазине, ведь никто не хочет с упоением ждать обновку, а затем расстроиться из-за висящих рукавов.
Для того чтобы не оказаться в такой ситуации и придумали размерные сетки, с помощью замеров можно понять, что подойдет вам. Но кто хочет вставать с диван во время дум-скроллинга и искать по всей квартире сантиметр?
Я обычно пользуюсь именно описанием параметров модели и фотографиями, как сидит вещь на нем. Это быстро и мне сразу понятно, какой крой будет у футболки или кофты.
UX – как лучше улучшать
На примере создания аккаунта в финансовом сервисе я покажу как построить и запустить процесс улучшения User Experience продукта. Что и в каком порядке делать продуктовому дизайнеру, чтобы никого не взбесить, и чтобы всем в команде стало лучше.
Начнём разбор с простого экрана загрузки фотографии паспорта.
Как спроектировать базу данных регулярного UX-исследования. Полный гайд на примере одного продукта
В организации любого исследования важны системность, логичность и наглядность. А когда речь идёт о регулярном, то есть периодическом исследовании, роль этих качеств становится особенно очевидна. Исследуя что-либо на длинной дистанции, к примеру, в течение нескольких лет, мы нуждаемся в инструменте, который позволяет хранить массивы данных, быстро обращаться к результатам разных волн исследования, отслеживать проблемы и делать корректные выводы.
Оптимальное решение в такой ситуации — создание и поддержка единой базы данных. Ниже на примере отдельного продукта мы пошагово расскажем, как её спроектировать.
Адаптируем иконку вашего приложения для visionOS
Иконки — визитные карточки для любого приложения в App Store. Наличие кроссплатформенного приложения подразумевает понимание контекста, в котором будет отображаться иконка.
Когда дело доходит до новых технологий, таких как visionOS, убедитесь, что у вас есть всё необходимое для эффективной адаптации значка приложения. Цель состоит в том, чтобы создать многослойную иконку, которую можно использовать в системе для придания эффекта глубины, когда пользователь выбирает приложение взглядом.
Принцип минимизации злобы
Здравствуйте, меня зовут Дмитрий Карловский и я.. всё никак не могу решить, стоит публиковать эту статью или нет. Я долго думал об этой дилемме Эскобара и пришёл к выводу, что..
Вклад авторов
jvetrau 3666.0alizar 2432.5forgotten 1155.0Milfgard 983.0dmitrysatin 833.0badlittleduck 810.8Leono 716.1kamushken 591.0grokru 541.0Bright_Translate 538.4