Давно не было технических статей.
Разработка UI UX у которых нет аналогов - 1 часть
Шаги разработки:
Проработка функционала
Проработка контента
Выбор цветовой палитры
Подбор референсов под элементы UX
Подбор стилистики, референсов под элементы UI
Разработка прототипа
Разработка UI
В первой части статьи разбираю первые 4 шага
...
Разработка UI UX у которых нет аналогов - 1 часть
Шаги разработки:
Проработка функционала
Проработка контента
Выбор цветовой палитры
Подбор референсов под элементы UX
Подбор стилистики, референсов под элементы UI
Разработка прототипа
Разработка UI
В первой части статьи разбираю первые 4 шага
...
Нулевой интерфейс - ты рили космос!
1. Что такое нулевой интерфейс и где он используется?
2. Исследования целевой аудитории нулевого интерфеса на примере космонавта.
3. Пример формирование персонажей и сценариев использования, на основе той же ситуации в космосе.
4. Пример адаптации контента под контекст ситуации
5. Применение искусственного интеллекта и алгоритмов машинного обучения.
6. Пример итеративного тестирования и улучшения, под тот же интерфейс
7. Пример возможного сценария итогового нулевого интерфейса для космонавта в космосе
...
1. Что такое нулевой интерфейс и где он используется?
2. Исследования целевой аудитории нулевого интерфеса на примере космонавта.
3. Пример формирование персонажей и сценариев использования, на основе той же ситуации в космосе.
4. Пример адаптации контента под контекст ситуации
5. Применение искусственного интеллекта и алгоритмов машинного обучения.
6. Пример итеративного тестирования и улучшения, под тот же интерфейс
7. Пример возможного сценария итогового нулевого интерфейса для космонавта в космосе
...
❤2
Упражнение:
Развить способность создавать ассоциативные связи между идеями для создания изображения.
Выберите слово или понятие, которое хотели бы визуализировать. Например, слово "эмоция"
Разбивка на ассоциации: Разбейте выбранное слово на 10 ключевых элементов, составляющих его смысл. Например, для слова "эмоция" элементами могут быть "цвет", "форма", "линия".
Разбейте их на пары и напишите каждой паре общую ассоциацию, вне зависимости от других слов. Например для слов "синий" и "тигр" ассоциация может быть "Бренд"
Ассоциации с элементами: Каждому ключевому элементу придумайте визуальную ассоциацию, которая появляется у вас. Это могут быть другие слова, образы или цвета. Запишите их рядом.
Рисование элементов: Нарисуйте каждый элемент вашего абстрактного изображения (например, абстрактные формы, линии, пятна цвета и т.д.) на отдельном кусочке бумаги или фрейме.
Сбор изображения: Соберите все нарисованные элементы вместе так, чтобы они создавали единое изображение.
Рекомендации и пример реализации👇
Развить способность создавать ассоциативные связи между идеями для создания изображения.
Выберите слово или понятие, которое хотели бы визуализировать. Например, слово "эмоция"
Разбивка на ассоциации: Разбейте выбранное слово на 10 ключевых элементов, составляющих его смысл. Например, для слова "эмоция" элементами могут быть "цвет", "форма", "линия".
Разбейте их на пары и напишите каждой паре общую ассоциацию, вне зависимости от других слов. Например для слов "синий" и "тигр" ассоциация может быть "Бренд"
Ассоциации с элементами: Каждому ключевому элементу придумайте визуальную ассоциацию, которая появляется у вас. Это могут быть другие слова, образы или цвета. Запишите их рядом.
Рисование элементов: Нарисуйте каждый элемент вашего абстрактного изображения (например, абстрактные формы, линии, пятна цвета и т.д.) на отдельном кусочке бумаги или фрейме.
Сбор изображения: Соберите все нарисованные элементы вместе так, чтобы они создавали единое изображение.
Рекомендации и пример реализации👇
Кролики, записала новый видео-обзор к подарочному шаблону в Figma
Шаблон для интернет-магазина, а именно главная страница
На видео:
1. Дестоп версия главной стариницы
2. Как изменить стиль
3. Правила замены контента
4. Адаптивная версия
Ссылка на макет под видео, а в обзоре рассказываю какие моменты важно учитывать при работе с шаблоном
https://youtu.be/pHKBy5V5qdw?si=RbIqFMm3REcAwMOr
Шаблон для интернет-магазина, а именно главная страница
На видео:
1. Дестоп версия главной стариницы
2. Как изменить стиль
3. Правила замены контента
4. Адаптивная версия
Ссылка на макет под видео, а в обзоре рассказываю какие моменты важно учитывать при работе с шаблоном
https://youtu.be/pHKBy5V5qdw?si=RbIqFMm3REcAwMOr
YouTube
Шаблон для главной страницы интернет-магазина в Figma. Предложен универсальный вариант стилистики.
https://www.figma.com/file/u9Oe70fKQb1gk6Q6t99AQJ/%D1%88%D0%B0%D0%B1%D0%BB%D0%BE%D0%BD?type=design&t=P7dYuNFXLM53PWA4-6
Что важно знать для разработки каталога:
https://youtu.be/zOO0JNHzopM?si=YxvUS6JwupO1IAJG
Статья о разработке макета без аналогов, по…
Что важно знать для разработки каталога:
https://youtu.be/zOO0JNHzopM?si=YxvUS6JwupO1IAJG
Статья о разработке макета без аналогов, по…
Новый разбор Ui макета брендового сайта и сам шаблон в подарок 🎁 ссылка на figma под видео
На видео:
1. Дестоп версия главной стариницы
2. Как изменить стиль
3. Правила замены контента
4. Адаптивная версия
5. Другие возможноные цветовые плитры
6. Как подготовить макет к верстке
https://youtu.be/dTm-hvcQJRg?si=SHzo0FYNkn41OVZ7
На видео:
1. Дестоп версия главной стариницы
2. Как изменить стиль
3. Правила замены контента
4. Адаптивная версия
5. Другие возможноные цветовые плитры
6. Как подготовить макет к верстке
https://youtu.be/dTm-hvcQJRg?si=SHzo0FYNkn41OVZ7
YouTube
UI для брендового сайта. Что нужно, для подготовки макета к верстке? Шаблон в Figme в подарок!
https://www.figma.com/file/n9AOdDooBVFsmQWVzcNzrH/%D1%88%D0%B0%D0%B1%D0%BB%D0%BE%D0%BD?type=design&t=ut1d06EOtQ0nkHxW-6
Как подобрать цвет, авторская методика:
https://telegra.ph/Metod-isklyucheniya-05-26
Доработка UX, авторская методика:
https://telegra.ph/Metod…
Как подобрать цвет, авторская методика:
https://telegra.ph/Metod-isklyucheniya-05-26
Доработка UX, авторская методика:
https://telegra.ph/Metod…
Грибочки, выкладываю первую часть статьи "Как находить идеи для дизайна?"
В статье разбираю 2 способа, которые сама использую, с примерами реализации.
"Дизайнер часто испытывает боль при большом количестве введенных ограничений для макета, что сильно тормозит воображение и не дает развиваться творческому потенциалы в Ui. И вот долгожданный проект, где заказчик готов полностью положиться на вас, но... что делать дальше?
Как найти достойную идею для дизайна, с глубоким смыслом, а не просто нарисовать красивую картинку?
...
В статье разбираю 2 способа, которые сама использую, с примерами реализации.
"Дизайнер часто испытывает боль при большом количестве введенных ограничений для макета, что сильно тормозит воображение и не дает развиваться творческому потенциалы в Ui. И вот долгожданный проект, где заказчик готов полностью положиться на вас, но... что делать дальше?
Как найти достойную идею для дизайна, с глубоким смыслом, а не просто нарисовать красивую картинку?
...
🤔1
Упражнение "Зеленая точка" на концентрацию
Такие упражнения обычно ассоциируются с медитативными традициями Востока, такими как буддизм или йога, где тренировка внимания и концентрации играет важную роль. Однако, они также могут быть встречены в современной психологии и методиках тренировки ума.
Оно очень простое в исполнении, но крайне полезное:
1. Нарисуйте зеленую точки на листе бумаги. Диаметр точки может быть разным, вы можете с этим экспериментировать.
2. Повесьте точку на стену или на любую другую поверхность.
3. Сядьте ровно напротив точки на расстоянии не менее 1 метра.
4. Сконцентрируйтесь на точке и не отводите от нее взгляд.
5. Если ваши мысли убегают прочь, возвращайте их к точке, важно отпустить все вокруг и больше ни о чем не думать.
6. Концентрируйтесь на зеленой точке пока не получится освободить сознание. Если у вас получится удерживать сознание хотя бы в течении 1 минуты, то далее вы сможете удерживать внимание любое количество времени.
Какая польза и какое влияние на мозг? 👇
Такие упражнения обычно ассоциируются с медитативными традициями Востока, такими как буддизм или йога, где тренировка внимания и концентрации играет важную роль. Однако, они также могут быть встречены в современной психологии и методиках тренировки ума.
Оно очень простое в исполнении, но крайне полезное:
1. Нарисуйте зеленую точки на листе бумаги. Диаметр точки может быть разным, вы можете с этим экспериментировать.
2. Повесьте точку на стену или на любую другую поверхность.
3. Сядьте ровно напротив точки на расстоянии не менее 1 метра.
4. Сконцентрируйтесь на точке и не отводите от нее взгляд.
5. Если ваши мысли убегают прочь, возвращайте их к точке, важно отпустить все вокруг и больше ни о чем не думать.
6. Концентрируйтесь на зеленой точке пока не получится освободить сознание. Если у вас получится удерживать сознание хотя бы в течении 1 минуты, то далее вы сможете удерживать внимание любое количество времени.
Какая польза и какое влияние на мозг? 👇
🦄15👍8❤🔥3🔥2👏1💋1
Универсальная защита дизайна
Эстетика - мать этики.
Понятие красоты было заложено в нас еще до появления моды, когда древний человек выбирал красивое для выживания, например:
- Какое красивое яблочко 🍎
Организм сделал его красивым, чтобы у сапиенса появилось желание попробовать. Необходимое кажется нам красивым.
Но красиво ли яблоко на самом деле?
Я хочу сказать, что дизайн - это не столько красивая картинка, сколько закладываемый в нее смысл. Таким образом вы можете заставить практически любой макет засверкать, вложив в него подходящий смысл. Особенно заметна эта логике при разборе логотипа, например adidas. Значки у таких лого очень простые в реализации, но заложенный в них смысл преобразует их в шедевр.
...
Эстетика - мать этики.
Понятие красоты было заложено в нас еще до появления моды, когда древний человек выбирал красивое для выживания, например:
- Какое красивое яблочко 🍎
Организм сделал его красивым, чтобы у сапиенса появилось желание попробовать. Необходимое кажется нам красивым.
Но красиво ли яблоко на самом деле?
Я хочу сказать, что дизайн - это не столько красивая картинка, сколько закладываемый в нее смысл. Таким образом вы можете заставить практически любой макет засверкать, вложив в него подходящий смысл. Особенно заметна эта логике при разборе логотипа, например adidas. Значки у таких лого очень простые в реализации, но заложенный в них смысл преобразует их в шедевр.
...
🔥9👍5🤡3❤2💔2🦄2👏1🥴1
Новый разбор Ui макета брендового сайта и сам шаблон в подарок 🎁 ссылка на figma под видео
На видео:
1. Дестоп версия главной стариницы
2. Как изменить стиль
3. Правила замены контента
4. Несколько вариантов превью карточек товара
5. Другие возможноные цветовые плитры
6. Как стлизовать кнопки
https://youtu.be/MZsi-ca5Vqc?si=GE2myF3XxtGfnxI2
На видео:
1. Дестоп версия главной стариницы
2. Как изменить стиль
3. Правила замены контента
4. Несколько вариантов превью карточек товара
5. Другие возможноные цветовые плитры
6. Как стлизовать кнопки
https://youtu.be/MZsi-ca5Vqc?si=GE2myF3XxtGfnxI2
YouTube
Шаблон стилистики для интернет мгазинна с превью карточки в подарок
https://www.figma.com/file/ZIOHFlrKIWANkcs6A9JUd7/%D0%A8%D0%B0%D0%B1%D0%BB%D0%BE%D0%BD?type=design&node-id=0%3A1&mode=design&t=c2vD2aBwmapn4EiH-1
#figma #ui #ux
#figma #ui #ux
💋5☃1❤1🔥1🥰1🤝1🗿1🆒1🦄1
Друзья!
На этой неделе я начинаю проводить интервью, для проверки выдвинутых гипотез, для мобильного приложения.
Напиши, @osipova_an если готов поучаствовать и увидеть процесс изнутри!
🕰️ интервью занимает примерно 15 минут.
Для себя ты узнаешь, как гипотезы проверяются на практике🤔
Интересующая меня аудитория:
Лица, которые так или иначе сталкивались с проблемами психологического здоровья
🎁 В подарок всем, кто примет участие отправлю книгу, как проводить интервью и проверить свои гипотезы на прочность!
Да будет svet🙏
На этой неделе я начинаю проводить интервью, для проверки выдвинутых гипотез, для мобильного приложения.
Напиши, @osipova_an если готов поучаствовать и увидеть процесс изнутри!
🕰️ интервью занимает примерно 15 минут.
Для себя ты узнаешь, как гипотезы проверяются на практике
Интересующая меня аудитория:
Лица, которые так или иначе сталкивались с проблемами психологического здоровья
Да будет svet
Please open Telegram to view this post
VIEW IN TELEGRAM
❤19👏4🍾3👍2
Чем умнее дизайнер, тем красивее и удобнее его кейсы.
Недавно нашла у себя в в еще юношеских архивах книжку «Кодекс Серафинианус»
Книга служит метафорой неразрешимости человеческого понимания мира. Серафини создает язык, который невозможно расшифровать, подчеркивая идею, что каждое культурное и языковое строение — это лишь один из вариантов восприятия реальности. Это ведет к размышлениям о том, что истинное знание и понимание — это колебание между тем, что мы можем выразить словами, и тем, что остается неизъяснимым. Таким образом, книга становится своеобразным художественным экспериментом, заставляющим нас осознать ограничения нашего собственного понимания.
Эту книгу я прикрепила вам файлом, а так же добавила из нее скриншоты.
В статье:
Как работать с книгой и зачем она?
Как скорость мозга влияет на дизайн?
Упражнение на развитие
...
Недавно нашла у себя в в еще юношеских архивах книжку «Кодекс Серафинианус»
Книга служит метафорой неразрешимости человеческого понимания мира. Серафини создает язык, который невозможно расшифровать, подчеркивая идею, что каждое культурное и языковое строение — это лишь один из вариантов восприятия реальности. Это ведет к размышлениям о том, что истинное знание и понимание — это колебание между тем, что мы можем выразить словами, и тем, что остается неизъяснимым. Таким образом, книга становится своеобразным художественным экспериментом, заставляющим нас осознать ограничения нашего собственного понимания.
Эту книгу я прикрепила вам файлом, а так же добавила из нее скриншоты.
В статье:
Как работать с книгой и зачем она?
Как скорость мозга влияет на дизайн?
Упражнение на развитие
...
❤10🔥6👍3🦄3⚡2
Принцип опровержения собственных гипотез
Эго - это не состояние творца, нужно признать ошибки, чтобы творить. Научное знание развивается не через подтверждение гипотез, а через их опровержение.
В статье:
Описание принципа
Как проводить касдевы
Как прописывать и опровергать гипотезы
Работа принципа в UI UX
Работа принципа в СХ
Эго - это не состояние творца, нужно признать ошибки, чтобы творить. Научное знание развивается не через подтверждение гипотез, а через их опровержение.
В статье:
Описание принципа
Как проводить касдевы
Как прописывать и опровергать гипотезы
Работа принципа в UI UX
Работа принципа в СХ
👏6❤4🔥4🦄2🍓1🤓1
Психоделический мир радикалов и их предпочтений в дизайне.
Как доминирующий радикал может вписаться в концептуальное искусство или IT-дизайн.
Например, целеустремленному радикалу подойдет роль арт-директора с минималистичным рабочим местом и стильной одеждой, идеально подходящей для вечернего рывка на диване.
В дизайне симметрия и асимметрия, как и в структуре радикалов, играют ключевую роль. Нейроны в мозге на самом деле склонны к определенной симметрии, что помогает быстрее обрабатывать визуальные образы. Пора разобрать тот мозговой баланс.
В статье подробно про каждый радикал
Дизайн, который подходит каждому радикалу
Должность соответствующая каждому радикалу
А так же о том как радикалы определять и совмещать
Недостатки радикалов в работе ui ux
👇
Как доминирующий радикал может вписаться в концептуальное искусство или IT-дизайн.
Например, целеустремленному радикалу подойдет роль арт-директора с минималистичным рабочим местом и стильной одеждой, идеально подходящей для вечернего рывка на диване.
В дизайне симметрия и асимметрия, как и в структуре радикалов, играют ключевую роль. Нейроны в мозге на самом деле склонны к определенной симметрии, что помогает быстрее обрабатывать визуальные образы. Пора разобрать тот мозговой баланс.
В статье подробно про каждый радикал
Дизайн, который подходит каждому радикалу
Должность соответствующая каждому радикалу
А так же о том как радикалы определять и совмещать
Недостатки радикалов в работе ui ux
👇
🔥6👍2🥰2❤1👎1👏1🦄1
Хотите научиться превращать древние идеи в современные хиты? В статье "Оптимизация интерфейсов по принципам древней мудрости: секреты достижения высот" обсуждаем, как старые концепции и нестандартные подходы можно адаптировать под любой проект — от бизнеса до креативного продукта.
Интересный факт: многие топовые интерфейсы и идеи, которые взрывают рынок сегодня, черпают вдохновение из глубокой древности и проверенных временем принципов. Узнайте, как переосмыслить любую идею, чтобы она работала в вашу пользу, и почему "мудрость веков" — это не клише, а ключ к успеху.
Прокачайте свои проекты, взглянув на привычное под новым углом. Читайте — и хайпуйте с умом! 🚀
Интересный факт: многие топовые интерфейсы и идеи, которые взрывают рынок сегодня, черпают вдохновение из глубокой древности и проверенных временем принципов. Узнайте, как переосмыслить любую идею, чтобы она работала в вашу пользу, и почему "мудрость веков" — это не клише, а ключ к успеху.
Прокачайте свои проекты, взглянув на привычное под новым углом. Читайте — и хайпуйте с умом! 🚀
🔥3👏3❤2😁1🦄1