Ответы пользователя по тегу Интерфейс пользователя
  • Чем отличаются Прототип Мокап и Вайрфрейм?

    tilion
    @tilion
    Веб-дизайнер
    Строго говоря, мокап - это изображение носителя (смартфон, ноутбук, рекламный стенд, книга, футболка, что угодно) для вставки в него изображения.
    Вайрфрейм - это эскиз/набросок/черновик интерфейса. Схематичное изображение, короче.
    Прототип - это функциональный эскиз, то есть, кликабельный. Например, юзабилити-тесты можно делать именно на прототипах.

    Какого чёрта мокапами и прототипами стали называть эскизы я хз, началось это лет 8 назад. Если тебе понадобится найти красивенький айфон, в который на место экрана ты вставишь интерфейс своего приложения, то ты будешь искать по запросу "iphone mockup".
    Если обратишься к википедии по запросу "прототип", то увидишь определение:
    Прототип (инженерия) — работающая модель, опытный образец устройства или детали в дизайне, конструировании, моделировании.

    Дальше можешь зайти на вики на страницу Быстрое прототипирование и увидеть определение:
    технология быстрого «макетирования», быстрого создания опытных образцов или работающей модели системы для демонстрации заказчику или проверки возможности реализации. Прототип позже уточняется для получения конечного продукта.

    И только пресловутый вайрфрейм является тем самым эскизом интерфейса, который многие ошибочно называют прототипом или мокапом.
    Ответ написан
    1 комментарий
  • Переход с основного сайта в ПУ, в той же вкладке или в новой?

    tilion
    @tilion
    Веб-дизайнер
    Отталкиваться надо от того, что в основном меняют в админке. Если админам надо часто переключаться на основной сайт, чтобы, например, проверить внесённые изменения, то открывайте в соседней вкладке. Если админам основной сайт почти никогда не нужен, то открывайте в той же вкладке.
    Ответ написан
    Комментировать
  • Как сделать обводку в figma только с одной стороны?

    tilion
    @tilion
    Веб-дизайнер
    Используйте Inner Shadow с параметром Blur равным нулю.
    Ответ написан
    Комментировать
  • Должен ли UI специалист создавать необходимую айдентику для сайта/приложения?

    tilion
    @tilion
    Веб-дизайнер
    UI дизайнер занимается UI, а айдентикой - бренд-дизайнер, дизайнер айдентики, дизайнер фирменного стиля, по-разному называют таких ребят. Как педиатр не будет хорошим анестезиологом, так и дизайнер интерфейсов не будет хорошим дизайнером айдентики. Может кое-что сделать, но на низком уровне. Если говорить "должен" ли, то нет, не должен.
    Ответ написан
    Комментировать
  • Как сочетается белое поле на чёрном фоне?

    tilion
    @tilion
    Веб-дизайнер
    Дизайнер нарисовал небольшие белые блоки на фоне крупного чёрного экрана. Что он этим получил? Контраст, который бьёт по глазам. Очень сильный акцент на этих блоках. Такой, что он призывает обратить внимание и при этом вызывает раздражение. Подходит ли такой приём для блоков с отзывами? Нет. Может ли такой приём пригодиться для чего-то другого? Возможно. Всё зависит от назначения.
    Ответ написан
    Комментировать
  • Юзабельный ли сервис?

    tilion
    @tilion
    Веб-дизайнер
    Первое, что заметил.

    - Главное должно быть главным. Блок с поиском выглядит второстепенным по сравнению с блоками с фотографиями, теряется. Посмотрите как сделано на https://www.airbnb.ru/
    - При вводе города в поиск нет подсказки ввода, поэтому сразу не ясно есть ли мой город на сайте.
    - Если в строке поиска переключаться между полями ввода клавишей TAB, то подсказки не уезжают вниз как если бы я кликнул в поле.
    - При загрузке страниц в качестве loader'а показывается лого сервиса - странно, не ясно, что оно там делает.
    - Если забыл пароль и хочешь восстановить, то вместо сайта показывается только блок восстановления на белом фоне - куда всё пропадает?
    - С экранов регистрации/авторизации невозможно вернуться на главную или любую другую страницу - вся навигация пропадает.
    Ответ написан
    Комментировать
  • В чем можно сделать анимацию прототипа сайта?

    tilion
    @tilion
    Веб-дизайнер
    Если вы на винде и нужно показать только скролл, то можно сделать два jpg: сайдбар и макет, залезть в простой онлайн wysiwyg конструктор прототипов и запилить в нём.

    P. S. "Кинетический прототип" - классно звучит).
    Ответ написан
    Комментировать
  • Как правильно разрабатывать адаптивный дизайн?

    tilion
    @tilion
    Веб-дизайнер
    Если автор вопроса - дизайнер, то надо знать основы css, чтобы понять в фотошопе как и откуда должна будет масштабироваться картинка для адекватного отображения на разных экранах. Ну и порисовать разные варианты с ней: делаете картинку смарт-объектом, рисуете несколько шапок разных размеров и смотрите как она себя ведёт. Но это если вы умница и молодец, обычно все забивают. И это плохо если хочешь работать на более высоком уровне чем "все" и зарабатывать больше них.
    Ответ написан
    Комментировать
  • Как научиться придумывать прототипы?

    tilion
    @tilion
    Веб-дизайнер
    Пища дизайнера - это визуальные объекты и их функционирование. Необходимо постоянно смотреть крутые работы, насыщать себя этой едой. Любое открытие - это переосмысление прошлых открытий и их синтез, поэтому кормите себя качественным дизайном. А чтобы создавать свои "открытия" надо понимать почему люди рисуют именно так и что вам нужно в конкретно вашем элементе дизайна - нужно понимать теорию, правильно мыслить. Тогда, из правильного дизайн-мышления вы сможете синтезировать новые визуальные решения.
    Ответ написан
    Комментировать
  • Как дизайнеры работают с анимацией?

    tilion
    @tilion
    Веб-дизайнер
    Для разработчиков идеально когда анимация уже представлена в виде кода. Для дизайнеров - когда она наглядно изображена. Есть программа Framer, которая это умеет (популярна среди дизайнеров Яндекса), но, во-первых, она для макоси, а, во-вторых, для её работы всё-таки надо уметь кодить - в ней экран поделён на часть с кодом и часть с визуализацией.

    Чтобы просто самому рисовать анимацию интерфейса достаточно Principle (тоже макось).

    Добавьте информацию о том для какой ОСи ищете программу.
    Ответ написан
    6 комментариев
  • UX or UX/UI? Есть ли жизнь для UX-дизайнера в наших реалиях?

    tilion
    @tilion
    Веб-дизайнер
    Илья Савельев: Понятие UX дизайнера ещё не устаканилось и очень размыто, разные компании понимают его по-разному. Если говорить о компаниях среднего уровня, то есть самодостаточная специальность — проектировщик интерфейсов, без примесей рисовальщика.

    UX дизайнер анализирует поведение пользователей, ход их мысли при работе с проектом. В чём выражается результат работы чистокровного UX дизайнера в процессе разработки сайта/приложения? Прототип. Он является визуализацией результатов анализирования и исследований. Поэтому ваш путь — проектировщик интерфейсов, он же UX дизайнер, без UI.

    При этом, топовые компании разделяют специальности проектировщика интерфейсов и UX аналитика, в них чистым UX занимаются аналитики. Немногие компании могут себе такое позволить — это компании уровня Альфа-банка, ВТБ, Mail.Ru, студии AGIMA, Google и так далее. Не уверен конкретно в этих брендах, но разделение происходит где-то на их уровне.

    Довольно забавно идёт эволюция UI дизайнера — сначала был веб-дизайнер, потом UI дизайнер, в компетенцию которого входят дизайн интерфейсов и базовые познания юзабилити, а недавно бывшие веб- и UI дизайнеры стали называть себя UI/UX дизайнерами, так как предполагается, что их компетенция расширилась до проработки некоего пользовательского опыта. И мало кто из них может сказать почему они назвали себя UX дизайнерами. Ну, тренд такой, просто, мол, название профессии изменилось, угук. И что такое базовое понимание UX дизайна (как раньше было необходимо базовое понимание юзабилити), чтобы называть себя UI/UX дизайнером — мало понятно.

    Сейчас вовсе нарастает тренд Product Designer'ов, которые перестают называть себя UI/UX дизайнерами и... чёрт их знает, что после "и...", я не понимаю кто эти люди).
    Ответ написан
    2 комментария
  • Где брать элементы дизайна для веб?

    tilion
    @tilion
    Веб-дизайнер
    Бесплатный фотосток: pixabay.com Единственный более мене адекватный из бесплатных. В отличии от остальных на нём действительно находил неплохие изображения в поиске. На других сайтах поиск не давал результатов.

    Иконки: www.flaticon.com iconmonstr.com/popular www.endlessicons.com Это глифы, то есть, иконки без стилизации (силуэты или контуры), они и используются на большинстве сайтов. можно качать сразу в векторе, можно в PNG.
    Ответ написан
    Комментировать