22 заметки с тегом

дизайн

Дизайн мобильных приложений. Летний интенсив в Британке

После обучения в Бюро Горбунова я хотел попасть на обучение в Британку. Это случилось на летнем интенсиве 2019. Расскажу про свой опыт и проект, который мы там делали.

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

В ходе обучение было весело, было сложно и было сжато. На что уходит месяц, нужно было сделать за 4 дня и применять новые знания, которые параллельно нам рассказывались.

На лекциях было много информации от разных спикеров.

У каждой команды был наставник, который включался в задачу и помогал. Завершением интенсива — выступление на большую аудиторию. Помимо строгих судьей, нас оценивали все желающие, которые пришли на открытую защиту. Часть из пришедших ищет дизайнеров к себе в компанию.

Наша презентация не обошлась без юмора

Наш концепт Яндекс Почты

Один из слайдов из презентации

Мое мнение: на интенсив я пошел уже имея за плечами почти год работы в Яндексе. Там еще раз прошелся по знакомым темам и структурировал знания. Узнал, что-то новое, но многое уже знал. Плюс прокачал навык презентации. Новичкам советую. Ссылка на интенсивы

Как дизайнеру перестать думать статически

Когда я начинал свой путь в дизайне, главное что меня беспокоило — как сделать финальную картинку. О том, как будет эта страница вести себя в цепочке остальных — я не задумывался. За полгода обучения в школе Горбунова, таких задач не возникало: мы проектировали не многостраничные сервисы, а что-то простое, одностраничное.

Образно, как я думал над макетом

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

Потом, приносил этот макет на обсуждение команде опытных дизайнеров. Получал список замечаний в духе: а что будет если нажать на эту кнопку, а что будет если данных не будет или не загрузятся. Как будет после нажатия на меню — для меня была загадка;

Мой наставник по стажировке дал мне совет, в духе «начни представлять как будет работать интерфейс, что будет в динамике». Полностью прочувствовал этот совет совсем недавно :-)

Теперь для меня интерфейс — это история, которая движется во времени. Я прокручиваю в голове идеальный путь пользователя, как покадровая анимация. Затем ищу затыки, редкие кейсы, которые могут произойти у пользователя.

Проектируется не страница, а история

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

Выводы: для проектирования интерфейсов представляйте как ваш интерфейс работает, как вы с ним взаимодействуете, прокрутите сценарий в голове от начала до конца. Все ли было окей? Где логика хромает? Если сложно представить, то поможет быстрый прототип в фигме, который можно дать «потыкать» кому-то ещё.

 Нет комментариев    2500   2020   дизайн   проектировани

Дизайн счетчика баллов в репетиторе

Какое-то время назад я помогал сервису Яндекс Репетитор повысить вовлеченность учеников. Для этого команда предложила сделать счетчик баллов. В итоге появился блок с баллами, блок и раздел с достижениями ученика.

При выполнении задания счетчик растет, можно перейти в достижения и посмотреть свою статистику
При наведении на каждый из предметов можно увидеть статистику по предмету: сколько баллов за сегодня и вклад за неделю
При достижении определенных значений — выдается награда с анимацией
 Нет комментариев    1916   2020   дизайн   проекты

Вопросы для страницы при проектировании дизайна

— Постоянно забываю нарисовать какую-то фигню для разработчиков, а они меня потом достают 😡
— Держи чек-лист!

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

Чек-лист для дизайнера перед сдачей макетов

  1. Состояние выделения у всех элементов, на которые можно нажать: кнопок, ячеек таблицы, инпуты.
  2. Пустые экраны: когда пользователь первый раз зайдет, когда у него ничего не будет, когда он все удалит, если нет аватарки.
  3. Что будет показываться, когда у пользователя медленный интернет: скелетон, картинка мелким размером, которая при дозагрузке станет четкой.
  4. Проверить текст на реальных данных. Что будет если текст не влезет, что если будет на других языках.
  5. Состояния ошибок, уведомления о действиях, алерты, попапы, 404 ошибка и т. д.
  6. Ну и само собой, если нарисовали веб-версию, не забываем про тачи и про ширину 320 px.
    Подробно об этом рассказывали в этом видео.

Чек-лист для проверки решения

А еще я для себя составляю чек-лист для этапа проверки своего решения, у кого есть идеи пишите в комментарии

  • Кто наши пользователи?
  • Какой основной сценарий выполняет пользователь на этом экране?
  • Как человек поймет, что это за интерфейс, будет ли обучение? Как разберется в нашем продукте?
  • Что главное должен считывать пользователь на этом экране?
  • Что не главное на этом экране?
  • Что если пользователь не готов выполнить наше действие или хочет отказаться?
  • Что если пользователя отвлекли? Он вспомнит что он делает на этом экране?
  • Как этот экран помогает пользователю выполнить его основной сценарий?
  • Какой будет не основной сценарий? А какой сценарий еще возможен?
  • Если есть цвета — как они помогают пользователю решить его задачу?
  •  Нет комментариев    1967   2020   дизайн   обучение   чек-лист

    Нужны ли полоски внутри таблицы

    Решил разобраться как лучше сделать с полосками или нет.

    Сперва смотрю на сайте бюро: нашел статью про черезполосицу, они предлагают её убирать. А вот мнение Ильи Бирмана насчет линий. И у него же отличный пример таблицы без полосок:

    Нужно взглянуть на примеры других сервисов:

    В моем случае решил выбрать 1 вариант:

    Пример с работы: между строчек есть или нет разделительной линии (шапку замазал, чтобы ни кто не догадался)

    Для себя нашел такие зависимости:

    1. Если в таблице 2-3 значения цифр то можно обойтись и без полосок: смотрится вполне хорошо.
    2. Когда много цифр и они находятся на непредсказуемом расстоянии друг от друга, по всей длине экрана — то полоски лучше использовать.
    3. Черезполосицу просто так использовать не стоит, но в анализе финансовых показателей этот приём может обозначать рост и падение акций.
    4. Если делать полоски, то делать их незаметными, серенькими.
     Нет комментариев    2168   2019   UX   дизайн   таблиц

    Как оценивать UX дизайн бесплатно и без исследований

    Предположим у нас есть 2 варианта пути пользователя. Как определить, что один из них лучше другого? В моем примере ниже — это очевидно: чем меньше экранов, тем лучше.

    Два варианта сценария покупки

    Но, что делать если количество экранов равно? Когда я столкнулся с такой задачей, то начал считать количество действий пользователя. Например, тут нужно: навести на кнопку «купить», нажать на кнопку, на другом экране прочитать заголовок, навести на кнопку добавить в корзину и т. д. Когда все действия расписаны, легко заметить, где нужно совершить меньше движений.

    Метод GOMS

    Более продвинутую методику я услышал от одного из спикеров на Media & Design Conference. Они так же считают количество действий пользователя, но еще переводят действия в секунды и оценивают финально сколько пользователь тратит времени на каждый экран. Самое интересное — расчеты времени пользователя.

    K = 0,28 c — нажатие клавиши клавиатуры;
    B = 0,2 с — клик мышью;
    P = 1,1 с — среднее время нахождения любого объекта на сайте;
    H = 0,4 с — перемещения руки с клавиатуры на мышь (или обратно);
    M = 1,35 с — ментальная пауза (время на обдумывание следующего шага).

    Почему то запись этого доклада пропала, но я для себя наскриншотил самое важное:

    С помощью этого способа можно доказать удобство одного из вариантов, но этот метод имеет свои исключения: например огромную форму для заполнения лучше разбить на несколько экранов.

     Нет комментариев    2243   2019   UX   дизайн

    Как проводить UX исследования

    Недавно я был на интенсиве в Британке. Необходимость проведения исследований над продуктом подчеркивал каждый лектор. И это правильно: наша модель мира, модель мира нашей команды может сильно отличаться от реальных пользователей. Материал интенсива и знания из опыта я попробую описать в этой статье.

    Твой мир может сильно отличаться от мировоззрения других

    Необходимо замерять показатели эффективности.

    Когда я открыл магазин матрасов, было мало конкурентов. Покупатели находили пару сайтов, выбирали и шли ко мне. Покупатели были, прибыль была → магазин рос. Но все изменилось через пару лет. Когда конкурентов стало много → клиенты стали реже приходить. Как понять где причина, что стало меньше покупателей? Я стал измерять показатели: сколько людей заходят на сайт, сколько времени они тратят, сколько из них звонят, приходят в магазин и создают заказ.

    Воронка продаж в моем представлении

    Горькая правда: Даже 1 шаг, который людям придется сделать, чтобы воспользоваться вашим продуктом, может стоить вам бизнеса.

    Пример про такси: таксисты 90% времени простаивали. В то время как клиенты искали их на остановках, звонили по телефону диспетчеру. Диспетчер искала водителей по рации. Водители соревновались у кого лучше рация и реакция. Когда появилось приложение для водителей, водители видели где клиент, а клиентам не нужно звонить диспетчерам. Все в выигрыше!

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

    Чтобы найти то, что может незаметно встроиться в нашу жизнь нужно найти потребность пользователей. Для этого проводят исследования. А для проведения достоверных исследований нужен целый арсенал умений:
    — Слушать
    — Слышать
    — Понимать реальную задачу
    — Анализировать предпосылки, мотивы
    — Правильно выстраивать беседу
    — Читать эмоции человека

    С полученными результатами тоже нужно уметь работать. Например, нужно уметь абстрагироваться от своего мнения и искать главное, отсекая слабые решения. Это звучит просто, но на практике применять этот принцип начинающему дизайнеру очень сложно. Со мной была такая когнитивная ошибка: нарисовал интерфейс, который, по-моему мнению, идеально выполнял задачу. Чтобы его проверить, я подходил к людям и предлагал им выполнить задание. Положительные ответы от пользователей я приумножал, а когда пользователь не справлялся — про себя я отмечал, что он «просто не целевая аудитория».

    Я часто искал подтверждение своего решения

    Исследования помогают:

    — найти проблемы интерфейса;
    — выявить и описать потребности пользователей;
    — правильно сформулировать бизнес-требования;
    — проверить эргономику решения.

    Качественное или количественное исследование

    Количественные — проверка решения на большом количестве респондентов. Например, сравнить два варианта дизайна и выбрать лучший. В этом помогает Яндекс Толока. Там много пользователей за копеечку сравнивают картинки. Для заказчиков — это возможность сравнить дизайн, опросить пользователей. Когда из 100 опрошенных, 70 выбирают вариант, который тебе казался хуже, это удивляет.

    Качественные — это часто наблюдение и опрос пользователя о том, что он делает. Пользователи могут привирать, придумывать, советовать улучшения в интерфейсе. В этом исследовании много тонкостей, поэтому особо важно фильтровать информацию и правильно его проводить. Далее про качественные исследования:

    Виды качественных исследований:
    — Интервью: узнаем боли и потребности
    — Юзабилити-тестирование: замеряем удобство
    — Карточная сортировка: говорим о структуре
    — Наблюдение: изучаем контекст
    — Опрос: узнаем мнение.
    — Соц сети/звонки/поддержка: читаем обратную связь.

    При проведении интервью следим, чтобы:

    — у нас были открытые вопросы,
    — мы молчим и слушаем, больше говорит респондент,
    — не задаем вопросы с вариантами ответа,
    — не поддакиваем пользователю, не говорим: «да нажимайте сюда...»
    — не используем профессиональный лексикон,
    — придерживаемся плана интервью, тратим не более 45 мин,
    — исследовать опыт пользователя, без вопросов (а если бы... вы купили?),

    Пользователи врут

    И мы тоже. Дето в том, что наш мозг изменяет прошлое, мы помним информацию искаженно, забываем и редактируем эмоциональные события; добавляем пробелы информации из стереотипов, упрощаем события и числа, отбрасываем частности. И еще множество искажений на картинке:

    Большая часть материалов составлена на основе лекции Алины Ермаковой. А вот её курс.

    Мой телеграмм канал
    P.S: волшебные фразы при тестировании: «мы тестируем интерфейс, а не вас. Тут нет неправильных ответов или правильных», «А как вам кажется, что это?»,

    С лекции «Другие миры» день 2 Эш Торп

    Был на двух днях на Стрелке. Спикеры рассказывали про знаки в фильмах (на примере Контакт), раскодровки анимации Рик и Морти, а Эш Торп рассказал о том, как работает. Я решил законспектировать именно её. В конце ссылки на полное видео с лекций.

    Как избавиться от творческих блоков

    1. Работать сразу над 2-3 проектами, когда в тупике над одним проектом, переключается на второй.
    2. Важно иногда отвлечься, делать перерывы.
    3. Находиться в кругу братьев по оружию.
    4. Избегать плохих привычек и ритуалов.
    5. Довести до конца начатое.

    Списки. Отчетность перед самим собой

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

    1. Записывать все: что хочешь достичь, в чем заинтересован, что нужно сделать и т. д.
    2. Избавляться от того, что требует ненужного внимания. (ухожу из компаний, где не интересно, не отвечаю на какие-то письма).
    3. Расставлять приоритеты между делами, фокусироваться только на том, что нужно и что приносит удовольствие.
    4. Расписать цели по порядку их выполнения.
    5. Эш заводит будильники и контролирует время.
    6. Доводить запланированные цели до конца.
    Ежедневник на 6 дней. Обычно вечером каждый день составляет что хочет сделать на следующий день.

    Эш постоянно читает.

    Список книг, которые он рекомендует

    Правила Эша

    1. Окружать себя людьми, которые вдохновляют. Те кто говорит, что ты отстой — от них нужно избавляться. Вокруг, должны быть те, кто бросает вызов, заряжает энергией.
    2. Важно оставаться скромным, не зазнаваться. Всегда оставаться учениками.
    3. Не оставливаться в своем творчестве.
    4. Всегда учиться, это постоянный процесс.
    5. Всегда помогайте окружающим.

    день 2

    день 1

    Верстка плаката про туризм

    Я подписан на рассылку дизайнера Лёши Рева. Как-то в рассылке получаю задание сверстать плакат. Результат нужно отправить на почту и получу обратную связь.

    Письмо с заданием

    Я решил попрактиковаться. На верстку потратил примерно полчаса: быстренько нашел картинку с туристом, текст редактировал по ходу, подвигал там-сям и получился простенький плакат с приглашением:

    Макет плаката про туризм

    На следующий день получил обратную связь. Спасибо Лёше за его внимательное отношение к обучению:
    https://monosnap.com/video/MAYrDXPWxOZvKGWhwMRkdOTLkKAwiC

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

    Плакаты из телеграмма https://t.me/posterino

    Мне говорили, чтобы так верстать нужно насмотренность и опыт. Буду рад наводкам, что почитать на эту тему.

     Нет комментариев    838   2017   видео   дизайн   плакат

    Дизайн-выходные в Нижнем Новгороде

    Самая спонтанная поездка: о событии я узнал в пятницу в 15 часов, а в 21 час уже садился на поезд. К сожаления, смог побывать только на первом дне, но узнал много нового. В статье коротко опишу выступления, а внизу будут материалы для просмотра и скачивания. Полезно для дизайнеров.

    Как делать плохую рекламу: инструкция по неприменению

    Антон Котовский на примере роликов показывал как плохо и как хорошо сделана реклама.
    Роликов было много, но смог найти только три.

    Реклама пельменей
    Реклама курсов языка
    Плохая реклама курсов языка

    Частые ошибки в видео рекламе:

    1. Пластиковые герои в которых не верят.
    2. Слишком далекая от жизни ситуация, иллюстрирующая эту же реальную жизнь.
    3. Неумение вытянуть из героя мимику.
    4. Плохая музыка.
    5. Несовпадение масштабов идеи и бюджета
    6. Отсутствие креатива.

    Немного опыта: как мы делаем сценарии и креативные концепции для сайтов

    Что важно для создания сайта

    Александр Ковальский рассказал про то, как они создавали сайты: «Есть несколько приёмов на котором строится сайт: визуал — эффекте — анимации — игровой момент — история. Миксуя эти штуки мы придумываем хороший сценарий и обычно это минимум интерфейса». Далее был рассказ про их кейс и про поиск идеи. Подробнее в аудио.

    Запись выступления:

    Совмещение эффектности и эффективности: серия 2

    Фото презентации Сергея

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

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

    Понятие эффектности — способность производить впечатления.
    Четыре типа эффектности:

    1. визуальная — когда анимация или изображение впечатляет. Это самый распространенный способ.
    2. смысловая — идея впечатляет, как в клипах группы окей, гоу.
    1. функциональная — пример сервиса, который позволяет рисовать крутые иконки https://www.autodraw.com/
    2. коммуникационная — то как продукт говорит с пользователями.
    Мой пример банк Точка

    Часть записи выступления:

    Материалы, которые выложили

    Как согласовывать макеты
    Основы менеджмента для дизайнеров

    Презентации:
    Михаил Губергриц: «Мятный Гусь, Имбирный Лось...»
    Сергей Мосякин: «Сезон метафор»
    Сергей Рассказов: «Шрифты без правил»

    Лекция Людвига в Рязани: «Как я выхожу из тупиков»

    Людвиг не учит, а делится опытом

    Тупик 1: акушерство и больничная горячка.

    Свою лекцию Людвиг начал с примера контринтуитивного мышления. Вена 1823-1847 гг. Если бы вы попали на стол к врачу, то с большой вероятностью могли умереть. 60% умирало, если требовалось вмешательство хирурга. Это было характерно для того времени, но именно в этом городе возникла интересная ситуация. Там была клиника, которая занималась акушерством, и два отделения. В одном из родительных отделений смертность была выше в 5 раз, чем во втором.

    Люди стали искать ответ, почему умирают роженицы (автор называет такие решения слабым ходом):

    • бог дал — бог взял,
    • дурная слава: умирают, потому что знают, что все тут умирают,
    • в 1 отделении ходил священник, и думали, что умирают от страха перед ним,
    • в 2 отделении принимали роды женщины, и решили, что женщины не стесняются женщин, поэтому выживают.

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

    И тут произошло интересное: Игнаца стали травить, запретили публиковать результаты, сообщество коллег решило, что он сбрендил, и упекли его в психушку. В итоге врач умер где-то в психушке, так и не добившись прорыва.

    Но 18 лет спустя получилось у другого врача, который научно обосновал знания микробов. Теория была принята, в итоге — «антисептик это хорошо, давайте мыть руки».

    Этот пример показывает, насколько сильное сопротивление возникает, когда находится выход из тупика. Если из тупика можно было выйти просто так — люди вышли. А если они в нём находятся, то нужен очень странный дикий прорыв.

    Тупик 2: прыжки в высоту.

    Советский плакат о том, как прыгать в высоту. (Вначале изображен «классический способ», а ниже альтернативный новый способ)

    Раньше все прыгали перекатом, то есть животом вперед.
    Слабое решение: упираться, бороться за сантиметры, чтобы прыгнуть выше.
    Появился чувак и попробовал прыгнуть иначе: спиной вперед. Его результат стал лучше, потому что легче перекидывать центр тяжести. Так он одержал победу в первой Олимпиаде.
    СМИ: ха-ха-ха, спортсмен, прыгает как обезьяна и выиграл. Однако ведущие спортсмены перехватили этот стиль. И он постепенно вошёл в моду.

    Возникает вопрос, где искать решения?
    Из примера с ребенком и носком есть два способа: получить опыт из вне или открыть способ самому. Чтобы получить контринтуитивный прорыв — учитель не нужен. Просто делай бред:

    Тупик 3. Тортик

    Фильм сахар, после которого Людвиг решил сократить сладкое.

    Людвиг выработал теорию «А чё, так можно было?». Тупик про тортик: приходишь в кафе, и предлагают тортик. На витрине тортики вертятся, они подсвечены и говорят тебе: «Дааа, съешь меня». Тут можно применить 2 стратегии и обе проигрышные:

    • «Нет, я не буду тортик». И тут ты понимаешь, что проиграл, потому что он вкусный.
    • «Да, я буду тортик». Ты кушаешь его, но чувствуешь себя ничтожеством, потому что сорвался.

    Самый дикий способ — чтобы не есть сахар, нужно есть сахар. Людвиг начал с утра кушать сухофрукты и  сладкое: шоколадки, конфеты. Возникает удивительный эффект — в кафе не хочется тортика, потому что утром будет сладкое (обязательно будет!). После этого вечерний торт становится не нужен.

    Итого

    Общие ошибки мышления

    У всех есть ошибки мышления. Хороший пример ФОА (фундаментальная ошибка атрибуции): когда какой-то чувак бьет автомат с водой, мы думаем что он «истеричка». А если ты попадешь в такую же ситуацию — то этого не замечаешь. Ты зависишь от ситуации, а все остальные так себя ведут, потому что «истерички».

    Про сохранение потраченного: «О господи, а сохранять ли нам проект, в который вложен год и 1 млн. рублей? Экономисты не говорят: да, надо спасать, столько же денег вложено. Они говорят — побыстрее бросаем балласт и идем дальше».

    Людвиг перечислил психологические затыки, которые бывают.

    Ошибки мышления: индивидуальные особенности

    Дихотомическое мышление. «Если я не добьюсь успеха во всем, то я неудачник».

    Катастрофизация. «Я так расстроюсь, что не смогу вообще ничего делать».

    Обесценивание позитивного. «Действительно, мне удалось выполнить эту работу. Но это вовсе не означает, что я способный — мне просто повезло».

    Эмоциональное обоснование.«Я знаю, что мне многое удается на работе, но я по-прежнему чувствую себя неудачником»

    Навешивание ярлыков. «Я неудачник», «Он зануда»

    Преувеличение и преуменьшение. «Средняя оценка говорит, что я неспособный. Оценка отлично не говорит о том, что я умный».

    Мысленный фильтр. «Один плохой результат по тесту (наряду с несколькими хорошими) свидетельствует о том, что я лентяй, который не смог как следует подготовиться».

    Чтение мыслей. «Он думает, что я ничего не смыслю в этой работе».

    Сверхгенерализация. «Поскольку я чувствовал себя не в своей тарелке на встрече, я не умею знакомиться с людьми».

    Персонализация. «Мастер по ремонту нагрубил мне потому, что я сделал что-то не так».

    Долженствование. «Ужасно, что я ошибся. Я должен во всем добиваться успеха».

    Приемы решения затыков:

    • обратиться к профессионалу (самый лучший способ),
    • выделить конкретное время на переживания,
    • если вы по отношению к кому-то даете добрый совет, а к себе строги — надо это исправить,
    • разговор с мышцами,
    • медитация.

    Тупик 4: рассеянность, несобранность, неудача.

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

    Практически все советы не работают, при том, что мир набит помогающими вещами и людьми. В статьях часто пишут очевидные ходы. У книг по саморазвитию огромные тиражи. Читаешь, а сделать так, как написано в книге не можешь или не работает. Начинаешь думать, что с тобой не так. Оказывается — все советуют то, что работает в их личном мире, не учитывая индивидуальные отличия. Вы же не будите советовать инвалиду правильно ходить, потому что физическая разница очевидна. А про психологические различия забывают.

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

    Игра, которая позволяет взглянуть по другому на мир (но надо протерпеть первые две минуты, с середины видео будет самый кайф).

    Полный список материалов собрал Александр Машков.

    Как улучшить дизайн предвыборного плаката

    Дизайн предвыборных плакатов однообразен. Это я заметил, когда поехал отдыхать в соседний город: мелькали одни и те же рекламные щиты. Может у кандидатов мало времени — не до дизайна. А может быть, то, что опишу — делают только профессиональные рекламные агентства. Я не хочу оскорбить депутатов, цель статьи показать, как можно сделать лучше. 

    Пока ехал, встретил 3 плаката: 

    Плакаты депутатов в Рязани

    Только плакат не убедит человека проголосовать за него. Его главная цель — напомнить человеку о депутате. В идеале, человек захочет узнать о кандидате больше: посмотреть сайт, программу или ютуб. Поэтому нужен комплексный подход. Не пытайтесь в плакат впихнуть всё подряд. 

    Давайте посмотрим, что в этом плакате не так:

    Восстановленный по фото плакат
    1. Фон не несет полезную информацию и ухудшает считывание на большом расстоянии. 
    2. Нет управления вниманием: не понятно, что тут главное и второстепенное.  
    3. Текст набран прописными буквами. 
    4. Имя сливается с фоном. Особенно на большом расстоянии. 
    5. Логотип в 3D.

    Очистим фон и уберём лишнее:

    Считывается лучше, но не вызывает интерес.

    Рассказываем историю через фото

    Над плакатом работают комплексно: 

    продумать позиционирование → написать лозунг → сверстать черновик → придумать как проиллюстрировать позиционирование → сфотографировать → протестировать → тиражировать. 

    Этот вариант стоит дороже, но отдача выше. 

    Фотография — самый сильный элемент на плакате. Она бывает «для галочки» или интересной: фото на паспорте скучное, а вот удачный кадр с отдыха — радует глаз. Продумайте детали, чтобы рассказать историю через фото:

    Депутат в военной форме с медалями, вызывает больше доверия, чем тот же человек в пиджаке. 
    В плакате Сталина художник продумал детали: человек в форме работает для Родины (источник getimg.germany.ru)

    Проделаем подобное. В учебных целях взял фото с сайта chita.ru, где депутат общается с рабочим. Удалим лишние детали с фото, расставим лозунг и акценты:

    Такой плакат вызывает больше интереса, чем с белым фоном.

    Чтобы сделать запоминающуюся рекламу продумайте позиционирование, напишите лозунг и проиллюстрируйте продукт или услугу. Фотографируйте продуманно. И следите за мелочами.
    Бонус. Процесс записал на видео: 

    Учебные проекты в бюро Горбунова

    За вторую ступень Школы дизайнеров бюро Горбунова сделал огромное количество сайтов, но самое главное — быстро. На каждую работу у нас было 4 дня, потом критика и ещё 4 дня на доработку. И за эти 4 дня нужно успевать работать, тратить время на семью и отдых.

    Одноэкранный сайт о себе

    За 4 дня нужно было успеть написать текст о себе и спроектировать страницу. Правильно расставить якорные объекты и подчеркнуть выразительность автора.

    Самое важное в работе — это фото. Но перефоткаться я не успел.

    Информационный текст для сайта

    Написать текст на заданную тему. Ну и раз мы дизайнеры — сверстать текст красиво и подобрать картинки. В бюро очень правильный подход к тексту — он не может быть без картинок. Цель автора рассказать историю, в том числе и через картинки.

    Максим высоко оценил мою работу. Но сильно снижал за шаблонные картинки кофе и не жизненные картинки.

    Вёрстка сложного документа

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

    Начало документа, правая часть «меню по договору» по идее должна была человеку помочь ориентироваться по договору, но в итоге только создала мусор.

    Проектирование сайта

    Пожалуй, это был самый интересное для меня задание. Для себя я сделал 3 интернет-магазина и мне было интересно узнать мнение эксперта к моему подходу. Спасибо Илье Бирману за советы.

    В странице всё должно быть направлено на продажи товара. Но выставить товар мало — нужно о нем рассказывать.

    Вёрстка многоэтажной веб-страницы

    Текст из 2-го задания нужно сверстать красиво. Задание мне с трудом даётся. Почему тут «тяжело», «страница перевесила» — я понимал с трудом. Под конец второй недели понимание стало по чуть-чуть приходить.

    Нужно все правильно сбалансировать и вызвать эмоции.

    Вопросы, замечания, предложения — пишите на почту sxep@yandex.ru или в телеграмм @geksin.

    Проект «Септики»

    Полезное действие: показать какие бывают септики, как они работают, сколько стоят и предложить оставить заявку.
    ЦА: владельцы частных домов, «дачники». Чаще всего мужчины 30-50 лет.

    Первый экран сразу все рассказывает про септики

    Первое, что видит человек — заголовок про монтаж септика, подзаголовок и схему устройства. Для большей информативности схема подписана, а под схемой три блока с выгодами сотрудничества. В какой-то мере этот блок стал «клеше», но мы разместили полезные фото, а не бессмысленные иконки.

    Скриншот первого и второго экрана

    Самый кайф в анимации:

    Посмотрел на анимацию и понял принцип работы

    Приятная деталь для широких мониторов:

    Крот в углу монитора вылез посмотреть

    Важная информация на 1-м месте

    Дизайнеры с фриланса прячут текст, таблицы. А для бизнеса важно показывать цифры, описания, названия моделей и т. д. Поэтому у нас картинка, описание и понятная таблица:

    Информация о каждом септике и полная информация по ссылке

    Культурное предложение спросить совета у профессионала, без крика, красной кнопки «купить» и счетчика.

    Форма сбора контактов и опубликованный договор с важными пунктами

    Над проектом работали:
    Дизайн, проектирование и написание текстов: Дмитрий Московский, Илья Трунин.
    Программирование: Андрей Тиньков.
    Благодарность за активное участие и терпение Михаилу Екишкину.
    Для связи: sxep@ya.ru

     Нет комментариев    288   2017   дизайн   проекты
    Ранее Ctrl + ↓