MVP — это продукт, который стоит максимально дешево, но уже может приносить пользу конечным пользователям.
Пример очень бюджетного MVP — стартап по продаже обуви Zappos, который невероятно взлетел, привлек много инвестиций и превратился в суперсервис. Но в самом начале у его основателя Ника Свинмерна не было ничего, кроме совсем простого сайта. Он размещал там фотографии обуви из местных магазинов, чтобы понять, есть ли на нее спрос. Когда кто-то делал заказ, Ник покупал эту пару и привозил клиенту. Свинмерн не вкладывался в инфраструктуру и оборудование, но смог создать у клиентов иллюзию полноценного сервиса и с минимальными затратами проверил, востребован ли его продукт.
Исключить хаотичные скачки
Спроектировать все возможные состояния самых сложных страниц, а потом понять, что сайт вообще не нужен — очень обидно. Хочется, чтобы таких ситуаций было меньше, и чтобы команда равномерно двигалась по уровню декомпозиции от большого к малому.
Чтобы не делать лишнюю работу, сначала проектируют объекты и только потом — способы взаимодействия с ними. Пока вы не решили, какие объекты вам нужны и не составили список, не нужно думать о том, что и как с ними делать.
Мыслить таким образом тяжело: обычно мозг сам раскручивает клубок идей и не может остановиться. Если нужно сделать рейтинг, следом обязательно приходит идея добавить отзывы и реферальную программу. Хочется сразу идти и делать, а обсуждать и анализировать необходимость этого не хочется совсем. В такие моменты нужно тормозить себя или клиента и двигаться только по шагам.
С чего начинается ООД. Составляем карту объектов
Главная единица ООД — объект. Этим термином я называю логически выделенную часть системы, с которой можно взаимодействовать и обмениваться сообщениями. Каждый объект — это сущность со значимыми параметрами, которой можно управлять через административную панель.
Чтобы работать над проектом по методу ООД, нужно выявить все объекты системы и разобраться с их свойствами. Для этого в ООД используют специальную карту, которая делается в несколько шагов.
1. Выявляем объекты
Сначала нужно найти все объекты, которые встречаются в системе. Это можно делать с помощью пользовательских историй, я применяю именно такой вариант.
Допустим, мы делаем программу для управления кадрами (HR). В ней HR-менеджер должен иметь возможность выгрузить список всех транзакций по покупкам вакансий на hh.ru, чтобы подготовить месячный отчет.
Здесь можно выделить объекты «пользователь» (с подтипом «HR-менеджер»), «транзакция» и «вакансия». С «вакансией» и «транзакцией» определиться легко: они точно являются объектами, с которыми проводятся операции в системе.
С «отчетом» сложнее. Это точно объект, но нет уверенности, что он должен быть частью вашей системы. Чтобы это понять, вы должны выяснить, для чего пользователю отчет и как именно он с ним взаимодействует.
Может оказаться, что HR-менеджер заходит в текущую программу, выгружает сырые данные о транзакциях в Excel, а потом идет в 1С и уже в этой системе составляет отчет привычным для себя образом. В текущем бизнес процессе возможность создавать отчет в проектируемой вами системе ему не нужна: ваша задача в новой системе дать возможность HR-менеджеру выгрузить список транзакций и не более.
В таком случае проектировщику нужно проанализировать: если сделать объект «отчет» частью новой системы, будет ли достигнут такой эффект, что это оправдает новые инвестиции? Или не стоит тратить на это время и ограничиться текущей реализацией.
2. Определяем параметры объекта и связи
На брейншторме, внутри команды или вместе с заказчиком находим все параметры, которые есть у объектов. Это может быть название, описание или дата создания.
Пример очень бюджетного MVP — стартап по продаже обуви Zappos, который невероятно взлетел, привлек много инвестиций и превратился в суперсервис. Но в самом начале у его основателя Ника Свинмерна не было ничего, кроме совсем простого сайта. Он размещал там фотографии обуви из местных магазинов, чтобы понять, есть ли на нее спрос. Когда кто-то делал заказ, Ник покупал эту пару и привозил клиенту. Свинмерн не вкладывался в инфраструктуру и оборудование, но смог создать у клиентов иллюзию полноценного сервиса и с минимальными затратами проверил, востребован ли его продукт.
Исключить хаотичные скачки
Спроектировать все возможные состояния самых сложных страниц, а потом понять, что сайт вообще не нужен — очень обидно. Хочется, чтобы таких ситуаций было меньше, и чтобы команда равномерно двигалась по уровню декомпозиции от большого к малому.
Чтобы не делать лишнюю работу, сначала проектируют объекты и только потом — способы взаимодействия с ними. Пока вы не решили, какие объекты вам нужны и не составили список, не нужно думать о том, что и как с ними делать.
Мыслить таким образом тяжело: обычно мозг сам раскручивает клубок идей и не может остановиться. Если нужно сделать рейтинг, следом обязательно приходит идея добавить отзывы и реферальную программу. Хочется сразу идти и делать, а обсуждать и анализировать необходимость этого не хочется совсем. В такие моменты нужно тормозить себя или клиента и двигаться только по шагам.
С чего начинается ООД. Составляем карту объектов
Главная единица ООД — объект. Этим термином я называю логически выделенную часть системы, с которой можно взаимодействовать и обмениваться сообщениями. Каждый объект — это сущность со значимыми параметрами, которой можно управлять через административную панель.
Чтобы работать над проектом по методу ООД, нужно выявить все объекты системы и разобраться с их свойствами. Для этого в ООД используют специальную карту, которая делается в несколько шагов.
1. Выявляем объекты
Сначала нужно найти все объекты, которые встречаются в системе. Это можно делать с помощью пользовательских историй, я применяю именно такой вариант.
Допустим, мы делаем программу для управления кадрами (HR). В ней HR-менеджер должен иметь возможность выгрузить список всех транзакций по покупкам вакансий на hh.ru, чтобы подготовить месячный отчет.
Здесь можно выделить объекты «пользователь» (с подтипом «HR-менеджер»), «транзакция» и «вакансия». С «вакансией» и «транзакцией» определиться легко: они точно являются объектами, с которыми проводятся операции в системе.
С «отчетом» сложнее. Это точно объект, но нет уверенности, что он должен быть частью вашей системы. Чтобы это понять, вы должны выяснить, для чего пользователю отчет и как именно он с ним взаимодействует.
Может оказаться, что HR-менеджер заходит в текущую программу, выгружает сырые данные о транзакциях в Excel, а потом идет в 1С и уже в этой системе составляет отчет привычным для себя образом. В текущем бизнес процессе возможность создавать отчет в проектируемой вами системе ему не нужна: ваша задача в новой системе дать возможность HR-менеджеру выгрузить список транзакций и не более.
В таком случае проектировщику нужно проанализировать: если сделать объект «отчет» частью новой системы, будет ли достигнут такой эффект, что это оправдает новые инвестиции? Или не стоит тратить на это время и ограничиться текущей реализацией.
2. Определяем параметры объекта и связи
На брейншторме, внутри команды или вместе с заказчиком находим все параметры, которые есть у объектов. Это может быть название, описание или дата создания.
Дальше определяем связи между отдельными объектами. Для этого будут полезны профили пользователей, которые, обычно, составляются с помощью маркетингового исследования.
Для каждого пользователя составляется карточка с профилем, в которой расписаны сценарии и цели. Смотрим на них и думаем, чего бы хотел от объекта конкретный человек, какую информацию ему нужно узнать на странице, какое действие совершить.
Например, обсуждая сценарии отправки резюме на вакансию, мы поняли, что многие соискатели могут не понимать реальный уровень своих навыков. Особенно это актуально для разработчика ПО: у каждой компании свои грейды, возможно, именно в этой организации он пока не дотягивает до статуса Junior или, наоборот, почти дорос до Middle. Поэтому решили добавить на сайт тесты, которые можно пройти, чтобы определить свой уровень.
«Тест» — это отдельный объект, который связан с объектом «вакансия».
3. Определить варианты и способы взаимодействия
На этом этапе рассматриваем каждый объект, чтобы понять, какие действия можно с ним совершать. Например, пользователь может откликнуться на вакансию, сохранить ее в избранном или просто посмотреть.
Когда варианты найдены, нужно определить, как именно будет происходить взаимодействие пользователя с объектами. Найти для этого лучшее решение — задача проектировщика интерфейсов.
Варианты взаимодействия определяются на брейншторме, во время которого клиент наконец-то начинает получать удовольствие от процесса, ведь теперь можно придумывать фичи.
Заказчики веселятся и радуются, но делают это в рамках конкретного объекта. Так можно избавится от хаоса, который обычно творится на встречах.
4. Определяем свойства параметров
Я придумал для свойств специальные обозначения.
А — автоматический параметр. Он проставляется системой, и человек не имеет к нему отношения. Таким параметром может быть дата или время создания.
Ф — фильтруемый (или сортируемый) параметр. Пользователь может взаимодействовать с ним интерактивно. Например выводить только те экземпляры объекта, которые соответствуют конкретному значению параметра. Допустим, посетитель информационного сайта может отфильтровать новости по темам и читать только про технологии.
Р — параметр, который задается вручную пользователем и/или администратором системы.
С — статический параметр, который вшит в верстку. Им нельзя управлять, а изменить его может только верстальщик либо разработчик.
В — внутренний параметр. Он используется в больших системах, где требуются связи, которые используются для организации внутренней работы с контентом и функциональностью сервиса. Например, внутренние теги. Вакансия отмечается тегом «срочно», чтобы администратор мог в административной панели отфильтровать только те вакансии, которые отмечены этим тегом и в первую очередь начать работу над ними.
Данные этого исследования заносим в таблицу.
5. Указываем способы взаимодействия для функций
Для них тоже задают условные обозначения. У нас они выглядят так:
0 — способ доступен без ограничений любому пользователю.
1 — способ доступен с ограничениями. На данном этапе неважно, с какими именно, главное, что ограничение есть и о нем нужно детально подумать при проектировании.
У объектов бывают разные состояния. Вакансия может быть открытой или архивной, но при этом закрытую вакансию все равно можно посмотреть. В графическом виде все связанные объекты неактивной вакансии будут такими же, как прежде, а из способов взаимодействия останется только «просмотр». Возможности «откликнуться» или «добавить пользователя» исчезнут.
Для каждого пользователя составляется карточка с профилем, в которой расписаны сценарии и цели. Смотрим на них и думаем, чего бы хотел от объекта конкретный человек, какую информацию ему нужно узнать на странице, какое действие совершить.
Например, обсуждая сценарии отправки резюме на вакансию, мы поняли, что многие соискатели могут не понимать реальный уровень своих навыков. Особенно это актуально для разработчика ПО: у каждой компании свои грейды, возможно, именно в этой организации он пока не дотягивает до статуса Junior или, наоборот, почти дорос до Middle. Поэтому решили добавить на сайт тесты, которые можно пройти, чтобы определить свой уровень.
«Тест» — это отдельный объект, который связан с объектом «вакансия».
3. Определить варианты и способы взаимодействия
На этом этапе рассматриваем каждый объект, чтобы понять, какие действия можно с ним совершать. Например, пользователь может откликнуться на вакансию, сохранить ее в избранном или просто посмотреть.
Когда варианты найдены, нужно определить, как именно будет происходить взаимодействие пользователя с объектами. Найти для этого лучшее решение — задача проектировщика интерфейсов.
Варианты взаимодействия определяются на брейншторме, во время которого клиент наконец-то начинает получать удовольствие от процесса, ведь теперь можно придумывать фичи.
Заказчики веселятся и радуются, но делают это в рамках конкретного объекта. Так можно избавится от хаоса, который обычно творится на встречах.
4. Определяем свойства параметров
Я придумал для свойств специальные обозначения.
А — автоматический параметр. Он проставляется системой, и человек не имеет к нему отношения. Таким параметром может быть дата или время создания.
Ф — фильтруемый (или сортируемый) параметр. Пользователь может взаимодействовать с ним интерактивно. Например выводить только те экземпляры объекта, которые соответствуют конкретному значению параметра. Допустим, посетитель информационного сайта может отфильтровать новости по темам и читать только про технологии.
Р — параметр, который задается вручную пользователем и/или администратором системы.
С — статический параметр, который вшит в верстку. Им нельзя управлять, а изменить его может только верстальщик либо разработчик.
В — внутренний параметр. Он используется в больших системах, где требуются связи, которые используются для организации внутренней работы с контентом и функциональностью сервиса. Например, внутренние теги. Вакансия отмечается тегом «срочно», чтобы администратор мог в административной панели отфильтровать только те вакансии, которые отмечены этим тегом и в первую очередь начать работу над ними.
Данные этого исследования заносим в таблицу.
5. Указываем способы взаимодействия для функций
Для них тоже задают условные обозначения. У нас они выглядят так:
0 — способ доступен без ограничений любому пользователю.
1 — способ доступен с ограничениями. На данном этапе неважно, с какими именно, главное, что ограничение есть и о нем нужно детально подумать при проектировании.
У объектов бывают разные состояния. Вакансия может быть открытой или архивной, но при этом закрытую вакансию все равно можно посмотреть. В графическом виде все связанные объекты неактивной вакансии будут такими же, как прежде, а из способов взаимодействия останется только «просмотр». Возможности «откликнуться» или «добавить пользователя» исчезнут.
Как это работает в моей компании
Описанную систему я периодически применяю уже несколько лет, а отдельные подходы ООД — более 6 лет. За это время мы увидели, какую пользу это приносит.
Получается точнее оценивать проекты
Раньше мы всегда работали по фиксированной цене и очень страдали, если ошибались с оценкой.
Клиенту неважно, укладывается ли аутсорсер в бюджет и хочет ли он делать какую-то работу, исполнитель должен выполнить то, что обещал по той цене, которую назвал.
Обычно мы оценивали проект страницами, делали карту сайта, максимально детализировали ее, но могли не продумать отдельные части backend. «Кто будет верстать админку?», — спрашивал разработчик в самом конце. «В смысле верстать админку?», — удивлялись остальные.
Применение ООД помогло нам оценивать проекты на 20−25% точнее. А главное, у нас появился мост между оценкой проекта и началом работы. Если клиент возвращается через месяц после оценки, у нас уже есть упрощенная модель системы — базис для начала работы.
Помогаем стартапам экономить
Порой ребята из стартапов знают про разработку цифровых продуктов столько же, сколько я про балет, но при этом они очень хотят поиграть в product-менеджеров. Стартаперы вдохновляются известными проектами, просят нас прикрутить на сайт красивую функцию, которую видели в «Инстаграме» или на Airbnb, а потом узнают, что это стоит 500 000 ₽ и пугаются.
Наша задача — показывать таким заказчикам объективную реальность. Список объектов и параметров здорово в этом помогает. Можно сказать человеку: «Смотри, если добавить параметр X, цена вырастет на 100 000 ₽, а если убрать Y — снизится на 200 000 ₽». Обычно клиент счастлив, потому что минус 200 000 ₽ — всегда классно.
Мозговые штурмы стали эффективней
Заказчики бывают разные, иногда к нам приходят сильные эксперты и мы с удовольствием учимся у них. Но бывают клиенты из малого бизнеса, которые знают о технологиях меньше, чем ничего. Мозговые штурмы с такими людьми очень непростые, но ООД помогает держать их в тонусе.
Берем профиль пользователя, кладем карточку на стол и всю встречу говорим только об одном объекте. Например, о том, как Вася взаимодействует с «вакансией». Клиент больше не отвлекается и не уходит в сторону. Раньше мозговые штурмы занимали 2,5−3 часа, а сейчас — 40−60 минут.
Появился обмен знаниями
Нам удалось без принуждения наладить постоянный обмен знаний между командами.
ООД предполагает общий документ, в котором сосредоточены ключевые знания о продукте. Обычно, члены команды подключаются к проекту по мере появление четких результатов предыдущих этапов и разработки ТЗ для их участка работ. При ООД все участники проекта могу подключаться к проекту намного раньше и раньше находить нестыковки, которые можно и нужно сразу обсуждать, вносить изменения и фиксировать в документации. Все мы знаем, как сложно и неприятно сталкиваться с ошибками в огромном ТЗ, которое уже согласовано с клиентом, и как часто участникам проекта не хочется вносить в него изменения, даже если это явно необходимо.
Проще делать контент
У нас есть партнеры, которые делают SEO. Они помогают сформировать правильную декомпозицию страниц, определяют, какие страницы объединять, а для каких делать отдельный интерфейс, в общем, разрабатывают подходящую для поисковых систем структуру. Благодаря ООД они могут работать параллельно проектированию.
Описанную систему я периодически применяю уже несколько лет, а отдельные подходы ООД — более 6 лет. За это время мы увидели, какую пользу это приносит.
Получается точнее оценивать проекты
Раньше мы всегда работали по фиксированной цене и очень страдали, если ошибались с оценкой.
Клиенту неважно, укладывается ли аутсорсер в бюджет и хочет ли он делать какую-то работу, исполнитель должен выполнить то, что обещал по той цене, которую назвал.
Обычно мы оценивали проект страницами, делали карту сайта, максимально детализировали ее, но могли не продумать отдельные части backend. «Кто будет верстать админку?», — спрашивал разработчик в самом конце. «В смысле верстать админку?», — удивлялись остальные.
Применение ООД помогло нам оценивать проекты на 20−25% точнее. А главное, у нас появился мост между оценкой проекта и началом работы. Если клиент возвращается через месяц после оценки, у нас уже есть упрощенная модель системы — базис для начала работы.
Помогаем стартапам экономить
Порой ребята из стартапов знают про разработку цифровых продуктов столько же, сколько я про балет, но при этом они очень хотят поиграть в product-менеджеров. Стартаперы вдохновляются известными проектами, просят нас прикрутить на сайт красивую функцию, которую видели в «Инстаграме» или на Airbnb, а потом узнают, что это стоит 500 000 ₽ и пугаются.
Наша задача — показывать таким заказчикам объективную реальность. Список объектов и параметров здорово в этом помогает. Можно сказать человеку: «Смотри, если добавить параметр X, цена вырастет на 100 000 ₽, а если убрать Y — снизится на 200 000 ₽». Обычно клиент счастлив, потому что минус 200 000 ₽ — всегда классно.
Мозговые штурмы стали эффективней
Заказчики бывают разные, иногда к нам приходят сильные эксперты и мы с удовольствием учимся у них. Но бывают клиенты из малого бизнеса, которые знают о технологиях меньше, чем ничего. Мозговые штурмы с такими людьми очень непростые, но ООД помогает держать их в тонусе.
Берем профиль пользователя, кладем карточку на стол и всю встречу говорим только об одном объекте. Например, о том, как Вася взаимодействует с «вакансией». Клиент больше не отвлекается и не уходит в сторону. Раньше мозговые штурмы занимали 2,5−3 часа, а сейчас — 40−60 минут.
Появился обмен знаниями
Нам удалось без принуждения наладить постоянный обмен знаний между командами.
ООД предполагает общий документ, в котором сосредоточены ключевые знания о продукте. Обычно, члены команды подключаются к проекту по мере появление четких результатов предыдущих этапов и разработки ТЗ для их участка работ. При ООД все участники проекта могу подключаться к проекту намного раньше и раньше находить нестыковки, которые можно и нужно сразу обсуждать, вносить изменения и фиксировать в документации. Все мы знаем, как сложно и неприятно сталкиваться с ошибками в огромном ТЗ, которое уже согласовано с клиентом, и как часто участникам проекта не хочется вносить в него изменения, даже если это явно необходимо.
Проще делать контент
У нас есть партнеры, которые делают SEO. Они помогают сформировать правильную декомпозицию страниц, определяют, какие страницы объединять, а для каких делать отдельный интерфейс, в общем, разрабатывают подходящую для поисковых систем структуру. Благодаря ООД они могут работать параллельно проектированию.
Это избавляет клиентов от лишних тревог. Обычные люди, и я в их числе, понятия не имеют, что делает SEO-специалист: он целый месяц творит какую-то магию, а потом ему платят. Заказчик не хочет тратить месяц на непонятную магию, и теперь у нас есть инструмент, который позволяет всем работать сообща, отталкиваясь от одного документа.
Копирайтерам тоже важно подключаться к процессу на этапе проектирования. Раньше до начала разработки сайта они могли лишь продумать стратегию и tone of voice, а теперь берут на себя больше задач: придумывают структуру текстов по каждому объекту (теперь у них на старте есть знания о параметрах объектов и вариантах взаимодействия с ним), создают драфты, выдвигают свои требования и пожелания по формированию состава объектов.
Вместо заключения
ООД — это лишь один из методов проектирования, он очень помогает в работе, но не может заменить собой все. Обычно мы используем ООД для больших контентных сайтов или сервисов, когда систему сложно уложить в голове.
Не стоит применять ООД для небольших корпоративных сайтов из нескольких страниц. Объектов там не будет совсем или найдется несколько совсем очевидных. Для работы с ними не нужен отдельный выделенный процесс.
Еще важно, чтобы документы, составленные в процессе, вовремя обновлялись и были доступны всей команде. Если не делать этого, ООД останется лишь на бумаге, и ни разработчики, ни копирайтеры, ни дизайнеры не станут в этом участвовать.
Этот подход пригодится и для внутренних заказчиков, но аргументация может быть иной: «Если уберем эту функцию, сэкономим 50 часов на проектирование».
Источник
Копирайтерам тоже важно подключаться к процессу на этапе проектирования. Раньше до начала разработки сайта они могли лишь продумать стратегию и tone of voice, а теперь берут на себя больше задач: придумывают структуру текстов по каждому объекту (теперь у них на старте есть знания о параметрах объектов и вариантах взаимодействия с ним), создают драфты, выдвигают свои требования и пожелания по формированию состава объектов.
Вместо заключения
ООД — это лишь один из методов проектирования, он очень помогает в работе, но не может заменить собой все. Обычно мы используем ООД для больших контентных сайтов или сервисов, когда систему сложно уложить в голове.
Не стоит применять ООД для небольших корпоративных сайтов из нескольких страниц. Объектов там не будет совсем или найдется несколько совсем очевидных. Для работы с ними не нужен отдельный выделенный процесс.
Еще важно, чтобы документы, составленные в процессе, вовремя обновлялись и были доступны всей команде. Если не делать этого, ООД останется лишь на бумаге, и ни разработчики, ни копирайтеры, ни дизайнеры не станут в этом участвовать.
Этот подход пригодится и для внутренних заказчиков, но аргументация может быть иной: «Если уберем эту функцию, сэкономим 50 часов на проектирование».
Источник
Хабр
Объектно-ориентированный дизайн и как его использовать для проектирования систем
С тех пор как интерфейсы программ, приложений и сайтов стали сложными, среди дизайнеров началось хаотичное деление на узкие специальности: появились системные и бизнес-аналитики,...
Как успешно провести онлайн-презентацию продукта или услуги?
В этой статье мы расскажем, как провести онлайн-презентацию с помощью вебинарной площадки ClickMeeting. Нет, рекламы самого сервиса не будет и про его функции как-нибудь в другой раз.
Сегодня только полезные рекомендации от большой команды, где трудятся опытные маркетологи, дизайнеры, копирайтеры, администраторы, менеджеры, и, конечно же, технические специалисты.
Как выглядит правильная презентация
Качественный, наглядный материал помогает зрителям лучше понять спикера и не умереть со скуки. Хорошая презентация удерживает внимание слушателей. В плохой все вперемежку: яркие слайды режут глаз, мозг пытается отчаянно понять смысл текста, а тем временем спикер усердно бормочет что-то в фоновом режиме.
Как сделать все правильно и с первого раза? Хорошая новость в том, что вам не нужно учиться на дизайнера или пересматривать все бесплатные уроки по фотошопу, которые найдете в сети. Достаточно внятно изложить суть вопроса. Этот принцип одинаково хорошо работает в онлайне и на публичных выступлениях в реальной жизни.
А зачем, вообще, проводить презентацию онлайн, если можно все так же внятно сказать своими словами?
Есть как минимум три причины добавить несколько слайдов к любому выступлению:
Эффективность. Визуализация доклада повышает процент остаточных знаний у слушателей. Во время мероприятия у всех собравшихся включается не только слуховая, но и зрительная память. В итоге люди получат больше полезных знаний, а также запомнят ваши услуги, товары, инфопродукты, экспертов или компанию.
Убедительность. Когда спикер загружает презентацию, аудитория сразу видит, насколько серьезная работа проделана перед началом выступления. Слушатели проникаются уважением к спикеру и начинают внимательнее слушать выступающего.
Интерактив. Презентация с фотографиями, элементами анимации, диаграммами, графиками и видеороликами оживит любое выступление и сделает его более интересным.
А может просто показывать то, что происходит на экране?
Конечно, делать это никто не запрещает. Но давайте посмотрим на ситуацию объективно.
Что будет, если демонстрировать экран, вместо презентации?
Нужно постоянно переключаться между окном, где вы показываете контент и окном для взаимодействия с участниками конференции.
Во время демонстрации экрана всегда виден заголовок и границы окна с открытым контентом.
Во время настройки гости мероприятия часто видят лишнее. Например, окна, которые не относятся к диалогу, какие-то фотографии, ярлыки вашего рабочего стола и так далее.
Файлы, которые вы хотите показать аудитории, нужно искать на компьютере в режиме онлайн. Чтобы не запутаться, придется заранее определить порядок запуска таких файлов и положить шпаргалку где-нибудь на видном месте.
Видео с камеры будет отображаться в маленьком окошке в углу экрана.
Как выглядит процесс демонстрации презентации онлайн?
Вы управляете показом прямо из личного кабинета или окна выбранного приложения.
Гости мероприятия видят только подготовленный для них контент без доступа к лишней информации.
Все файлы презентации можно подготовить заранее и выводить на экран одним кликом.
Презентация отображается в отдельном окне, поэтому аудитория хорошо видит контент и спикера.
План онлайн-презентации и работа со слайдами
Обязательный этап подготовки презентации — изучение продукции и клиента. Надеемся, что вы уже знаете о чем и для кого будете рассказывать, иначе вся затея теряет смысл.
После предварительной подготовки составьте план выступления. Даже если вы просто напишете на листке бумаги основные пункты и тезисы — это уже будет намного лучше, чем ничего. Если в процессе общения со слушателями вы немного зайдете в сторону, план всегда поможет вернуться в нужное место и пойти намеченным курсом.
В этой статье мы расскажем, как провести онлайн-презентацию с помощью вебинарной площадки ClickMeeting. Нет, рекламы самого сервиса не будет и про его функции как-нибудь в другой раз.
Сегодня только полезные рекомендации от большой команды, где трудятся опытные маркетологи, дизайнеры, копирайтеры, администраторы, менеджеры, и, конечно же, технические специалисты.
Как выглядит правильная презентация
Качественный, наглядный материал помогает зрителям лучше понять спикера и не умереть со скуки. Хорошая презентация удерживает внимание слушателей. В плохой все вперемежку: яркие слайды режут глаз, мозг пытается отчаянно понять смысл текста, а тем временем спикер усердно бормочет что-то в фоновом режиме.
Как сделать все правильно и с первого раза? Хорошая новость в том, что вам не нужно учиться на дизайнера или пересматривать все бесплатные уроки по фотошопу, которые найдете в сети. Достаточно внятно изложить суть вопроса. Этот принцип одинаково хорошо работает в онлайне и на публичных выступлениях в реальной жизни.
А зачем, вообще, проводить презентацию онлайн, если можно все так же внятно сказать своими словами?
Есть как минимум три причины добавить несколько слайдов к любому выступлению:
Эффективность. Визуализация доклада повышает процент остаточных знаний у слушателей. Во время мероприятия у всех собравшихся включается не только слуховая, но и зрительная память. В итоге люди получат больше полезных знаний, а также запомнят ваши услуги, товары, инфопродукты, экспертов или компанию.
Убедительность. Когда спикер загружает презентацию, аудитория сразу видит, насколько серьезная работа проделана перед началом выступления. Слушатели проникаются уважением к спикеру и начинают внимательнее слушать выступающего.
Интерактив. Презентация с фотографиями, элементами анимации, диаграммами, графиками и видеороликами оживит любое выступление и сделает его более интересным.
А может просто показывать то, что происходит на экране?
Конечно, делать это никто не запрещает. Но давайте посмотрим на ситуацию объективно.
Что будет, если демонстрировать экран, вместо презентации?
Нужно постоянно переключаться между окном, где вы показываете контент и окном для взаимодействия с участниками конференции.
Во время демонстрации экрана всегда виден заголовок и границы окна с открытым контентом.
Во время настройки гости мероприятия часто видят лишнее. Например, окна, которые не относятся к диалогу, какие-то фотографии, ярлыки вашего рабочего стола и так далее.
Файлы, которые вы хотите показать аудитории, нужно искать на компьютере в режиме онлайн. Чтобы не запутаться, придется заранее определить порядок запуска таких файлов и положить шпаргалку где-нибудь на видном месте.
Видео с камеры будет отображаться в маленьком окошке в углу экрана.
Как выглядит процесс демонстрации презентации онлайн?
Вы управляете показом прямо из личного кабинета или окна выбранного приложения.
Гости мероприятия видят только подготовленный для них контент без доступа к лишней информации.
Все файлы презентации можно подготовить заранее и выводить на экран одним кликом.
Презентация отображается в отдельном окне, поэтому аудитория хорошо видит контент и спикера.
План онлайн-презентации и работа со слайдами
Обязательный этап подготовки презентации — изучение продукции и клиента. Надеемся, что вы уже знаете о чем и для кого будете рассказывать, иначе вся затея теряет смысл.
После предварительной подготовки составьте план выступления. Даже если вы просто напишете на листке бумаги основные пункты и тезисы — это уже будет намного лучше, чем ничего. Если в процессе общения со слушателями вы немного зайдете в сторону, план всегда поможет вернуться в нужное место и пойти намеченным курсом.
При подготовке слайдов используйте этот простой и удобный чек-лист
Оформляйте все слайды в одном стиле.
Используйте при оформлении фирменный стиль или корпоративные цвета компании.
Будьте предельно лаконичны. Один слайд — одна мысль, максимум, пара шрифтов и не более трех цветов при подготовке дизайна.
Сделайте акцент на ключевой мысли или идее слайда.
Если этого не требует формат доклада, откажитесь от анимированных элементов. Они отвлекают аудиторию от основной сюжетной линии.
Подготовьте главное изображение, которое аудитория увидит перед началом мероприятия.
Используйте последний слайд для благодарности всех присутствующих, укажите на нем полезные контакты и ссылки.
Что делать за один-два дня до старта
Попробуйте рассказать доклад самому себе, перед зеркалом, в спокойной домашней обстановке. Если все получается хорошо, запишите тестовую версию, посмотрите, как все выглядит со стороны, подтяните слабые или неудачные моменты. Например, подкорректируйте разработанный план или подачу информации.
За 24 часа до начала мероприятия еще раз напомните о себе, подтвердите, что готовы провести трансляцию, уточните кто из спикеров и гостей точно будет присутствовать на встрече. Иногда у аудитории появляются интересные вопросы за несколько часов до начала доклада и их стоит включить в завершающую часть выступления.
Проверьте, как выглядит переговорная комната глазами клиента, убедитесь, что открываются все ссылки, протестируйте работу оборудования и сделайте пробный звонок со стороны клиента.
Перед началом трансляции закройте лишние окна браузера, мессенджеры и другие приложения, которые не участвуют в онлайн-событии. Вы почувствуете себя комфортнее, если наведете порядок на рабочем столе.
Запланировали показать несколько страниц из браузера? Заранее загрузите и поставьте вкладки в порядке очереди. Соберите в отдельную папку файлы, которые будете использовать в процессе выступления. Чтобы не запутаться, не стоит держать все приложения и документы в развернутом виде. Если все будет под рукой и на видных местах — этого более чем достаточно.
Как провести интересную онлайн-презентацию
Когда психологическая техническая подготовка к презентации завершена, начинайте работать с аудиторией.
Поприветствуйте собравшихся.
Спросите у аудитории, насколько хорошо они слышат звук и видят картинку. Убедитесь в корректной работе чата.
Проверьте, как загружается визуальный ряд.
Держите под рукой структуру презентации.
Расскажите немного о себе и переходите к основной части доклада.
Оставьте время для ответов на вопросы слушателей.
Озвучьте свое предложение, если запланировали продажу какого-то продукта.
Отправьте слушателям презентацию, дополнительные материалы и попытайтесь получить обратную связь. Например, попросите пройти небольшой опрос и оценить качество презентации.
Оформляйте все слайды в одном стиле.
Используйте при оформлении фирменный стиль или корпоративные цвета компании.
Будьте предельно лаконичны. Один слайд — одна мысль, максимум, пара шрифтов и не более трех цветов при подготовке дизайна.
Сделайте акцент на ключевой мысли или идее слайда.
Если этого не требует формат доклада, откажитесь от анимированных элементов. Они отвлекают аудиторию от основной сюжетной линии.
Подготовьте главное изображение, которое аудитория увидит перед началом мероприятия.
Используйте последний слайд для благодарности всех присутствующих, укажите на нем полезные контакты и ссылки.
Что делать за один-два дня до старта
Попробуйте рассказать доклад самому себе, перед зеркалом, в спокойной домашней обстановке. Если все получается хорошо, запишите тестовую версию, посмотрите, как все выглядит со стороны, подтяните слабые или неудачные моменты. Например, подкорректируйте разработанный план или подачу информации.
За 24 часа до начала мероприятия еще раз напомните о себе, подтвердите, что готовы провести трансляцию, уточните кто из спикеров и гостей точно будет присутствовать на встрече. Иногда у аудитории появляются интересные вопросы за несколько часов до начала доклада и их стоит включить в завершающую часть выступления.
Проверьте, как выглядит переговорная комната глазами клиента, убедитесь, что открываются все ссылки, протестируйте работу оборудования и сделайте пробный звонок со стороны клиента.
Перед началом трансляции закройте лишние окна браузера, мессенджеры и другие приложения, которые не участвуют в онлайн-событии. Вы почувствуете себя комфортнее, если наведете порядок на рабочем столе.
Запланировали показать несколько страниц из браузера? Заранее загрузите и поставьте вкладки в порядке очереди. Соберите в отдельную папку файлы, которые будете использовать в процессе выступления. Чтобы не запутаться, не стоит держать все приложения и документы в развернутом виде. Если все будет под рукой и на видных местах — этого более чем достаточно.
Как провести интересную онлайн-презентацию
Когда психологическая техническая подготовка к презентации завершена, начинайте работать с аудиторией.
Поприветствуйте собравшихся.
Спросите у аудитории, насколько хорошо они слышат звук и видят картинку. Убедитесь в корректной работе чата.
Проверьте, как загружается визуальный ряд.
Держите под рукой структуру презентации.
Расскажите немного о себе и переходите к основной части доклада.
Оставьте время для ответов на вопросы слушателей.
Озвучьте свое предложение, если запланировали продажу какого-то продукта.
Отправьте слушателям презентацию, дополнительные материалы и попытайтесь получить обратную связь. Например, попросите пройти небольшой опрос и оценить качество презентации.
Как удержать внимание слушателей
В этом вам помогут интерактивы. Вариантов масса. Например, можно провести тест, запустить видео, показать интерактивный слайд или задать один простой вопрос. Главное — сразу объяснить собравшимся, как проходит интерактив.
Некоторые спикеры задают общий вопрос и ждут какой-то реакции. Ответом на такие действия становится тишина. Потому что аудитория не получила четкие инструкции и ждет, как будут развиваться события.
Интерактив — отличный способ сделать презентацию более интересной и живой. Особенно если запланирован длинный доклад. Оптимальный интервал для интерактива во время выступлений онлайн — каждые 5–7 минут.
Еще один проверенный способ — динамичная подача материала. Многие спикеры говорят медленно и тихо. Такая презентация лишена энергии, ее трудно слышать, еще труднее сосредоточиться и понять основные мысли, даже если сам доклад представляет информационную ценность.
Улучшить ситуацию помогает ускорение речи. Но это не значит, что нужно выступать на одном дыхании и выдать всю информацию без пауз, как из пулемета. Искусство динамики заключается в интонации, скорости и громкости речи.
Используйте паузы, чтобы подчеркнуть важные мысли или выделить отдельные информационные блоки. Выступление без пауз воспринимается так же плохо, как тихая и невыразительная речь спикера.
Что в итоге?
Первые онлайн-презентации кажутся сложными и долгими, потому что подготовка к докладу занимает много времени. Но задача постепенно будет упрощаться с каждым следующим выступлением. Главное — адаптировать мероприятие под конкретную целевую аудиторию и стараться придерживаться заявленного расписания.
Источник
В этом вам помогут интерактивы. Вариантов масса. Например, можно провести тест, запустить видео, показать интерактивный слайд или задать один простой вопрос. Главное — сразу объяснить собравшимся, как проходит интерактив.
Некоторые спикеры задают общий вопрос и ждут какой-то реакции. Ответом на такие действия становится тишина. Потому что аудитория не получила четкие инструкции и ждет, как будут развиваться события.
Интерактив — отличный способ сделать презентацию более интересной и живой. Особенно если запланирован длинный доклад. Оптимальный интервал для интерактива во время выступлений онлайн — каждые 5–7 минут.
Еще один проверенный способ — динамичная подача материала. Многие спикеры говорят медленно и тихо. Такая презентация лишена энергии, ее трудно слышать, еще труднее сосредоточиться и понять основные мысли, даже если сам доклад представляет информационную ценность.
Улучшить ситуацию помогает ускорение речи. Но это не значит, что нужно выступать на одном дыхании и выдать всю информацию без пауз, как из пулемета. Искусство динамики заключается в интонации, скорости и громкости речи.
Используйте паузы, чтобы подчеркнуть важные мысли или выделить отдельные информационные блоки. Выступление без пауз воспринимается так же плохо, как тихая и невыразительная речь спикера.
Что в итоге?
Первые онлайн-презентации кажутся сложными и долгими, потому что подготовка к докладу занимает много времени. Но задача постепенно будет упрощаться с каждым следующим выступлением. Главное — адаптировать мероприятие под конкретную целевую аудиторию и стараться придерживаться заявленного расписания.
Источник
Medium
Как успешно провести онлайн-презентацию продукта или услуги?
В этой статье мы расскажем, как провести онлайн-презентацию с помощью вебинарной площадки ClickMeeting. Нет, рекламы самого сервиса не…
Изучите основы UI дизайна на примере фильмов
Фильмы, как вид искусства, были широко распространены в нашем обществе задолго до того, как люди начали изучать визуальный дизайн или просто дизайн, как дисциплину. Первый фильм был выпущен в 1888 году под названием «Сцена в саду Раундхей». Это был короткий немой фильм (2 секунды), записанный французским изобретателем Луи Лепренсом.
С тех пор мир пережил множество революций, войн, изобретений и пандемий. Каждое из этих событий так или иначе оказало особое влияние на киноиндустрию, сделав ее такой, какой мы знаем ее сегодня.
С развитием визуальной коммуникации приходит и визуальный дизайн. Поскольку слово «дизайн» на самом деле относится к решению проблем, а не просто к созданию привлекательных артефактов, то каждая методика решения проблем имеет ряд фундаментальных законов / принципов / теорий / формул, на основе которых применяется этот метод. То же самое и с визуальным дизайном.
Фильмы, как вид искусства, были широко распространены в нашем обществе задолго до того, как люди начали изучать визуальный дизайн или просто дизайн, как дисциплину. Первый фильм был выпущен в 1888 году под названием «Сцена в саду Раундхей». Это был короткий немой фильм (2 секунды), записанный французским изобретателем Луи Лепренсом.
С тех пор мир пережил множество революций, войн, изобретений и пандемий. Каждое из этих событий так или иначе оказало особое влияние на киноиндустрию, сделав ее такой, какой мы знаем ее сегодня.
С развитием визуальной коммуникации приходит и визуальный дизайн. Поскольку слово «дизайн» на самом деле относится к решению проблем, а не просто к созданию привлекательных артефактов, то каждая методика решения проблем имеет ряд фундаментальных законов / принципов / теорий / формул, на основе которых применяется этот метод. То же самое и с визуальным дизайном.
В течение нескольких десятилетий развития кино как коммерческой индустрии, а также изучения искусства в колледжах, люди начали покупать билеты на шоу, через цифровые интерфейсы на своих девайсах. Эти девайсы было необходимо упростить в использовании и освоении, что само по себе являлось проблемой. Чтобы решить эту проблему, появилась новая дисциплина дизайна, а именно дизайн пользовательского интерфейса.
Хотя это не совсем та причина, которая привела к рождению совершенно новой области дизайна. Но это один из многих способов связи кино и UI дизайна. Давайте сразу перейдем к разбору основ UI дизайна на примере наших любимых фильмов.
Баланс
Это обыденная вещь, которую можно найти в любом стабильном дизайне, если только его умышленно не нарушили.
Баланс можно понимать, как распределение визуального веса объектов, цветов, текстур и пространства. Если на экране много контента, его следует сбалансировать, чтобы дизайн выглядел стабильным.
Симметрия – один из способов добиться баланса в визуальном дизайне. Природа любит симметрию, поэтому и наши глаза тоже. Симметрично сбалансированные элементы помогают снизить шум от изображения и сделать его знакомым.
Режиссёры фильмов давно используют симметрию, как мощный инструмент для создания визуально стабильных кадров. Но баланса можно добиться и в несимметричных изображениях с помощью цветов, объектов, пространства и текстуры.
Чтобы сделать интерфейс сбалансированным, необходимо разместить элементы на холсте соответственно их весу, чтобы визуально стабилизировать все объекты, присутствующие на экране.
Баланс в пользовательском интерфейсе
Акцент (выделение)
Акцент используется в большинстве областей дизайна, включая архитектуру, ландшафтный дизайн и дизайн одежды. Кроме того, он активно используется в кинематографе. Создатели фильмов используют всевозможные методы, чтобы выделить объект, на который должны смотреть зрители.
Акцент – это стратегия, направленная на привлечение внимания зрителя к определенному элементу дизайна. Это может быть область контента, изображение, ссылка, кнопка и т. д.
В кино для создания акцента на элементе используется фокус, контраст и т. д. Это делается для того, чтобы рассказать часть истории, относящейся к выделенному объекту.
В UI дизайне также есть повествование. Когда мы хотим поместить элемент в фокус, мы выделяем его, используя один из нескольких методов.
Выделение элемента в UI дизайне
Иерархия
Каждый человек по-своему понимает смысл фильма. Наши выводы о фильме, зависят от того, какие фильмы мы смотрели долгое время, и от того, как они повлияли на нашу точку зрения. Режиссер не контролирует это, но, понимая простые модели поведения, он может контролировать, куда мы будем переводить взгляд с одной точки на другую.
Иерархия – это контроль визуальной информации посредством ее расположения или презентации, чтобы выделить главное. Она влияет на порядок, в котором человеческий глаз воспринимает увиденное.
В каждом фильме создатели применяют ту или иную форму иерархической схемы, чтобы переместить взгляд аудитории с одной точки на другую. Обычно это делается для того, чтобы рассказать историю в необходимом порядке.
Когда пользователи взаимодействуют через экраны, важно направить их внимание в правильном порядке. В хорошем дизайне элемент, который идет первым, должен иметь связь с последующим элементом, а любой последующий элемент должен быть связан со своим предшественником.
Большинство приложений и сайтов применяют этот принцип для размещения элементов в правильном порядке. Родительский элемент обычно помещается либо поверх дочернего, либо слева от него.
Элементы расположены в соответствии с иерархией
Повторение
Когда дело доходит до поиска закономерностей в неизвестных объектах, люди склонны придерживаться ритмов. Ритмы в изображении, звуке, видео формируются с помощью повторений в расположении элементов на экране.
Хотя это не совсем та причина, которая привела к рождению совершенно новой области дизайна. Но это один из многих способов связи кино и UI дизайна. Давайте сразу перейдем к разбору основ UI дизайна на примере наших любимых фильмов.
Баланс
Это обыденная вещь, которую можно найти в любом стабильном дизайне, если только его умышленно не нарушили.
Баланс можно понимать, как распределение визуального веса объектов, цветов, текстур и пространства. Если на экране много контента, его следует сбалансировать, чтобы дизайн выглядел стабильным.
Симметрия – один из способов добиться баланса в визуальном дизайне. Природа любит симметрию, поэтому и наши глаза тоже. Симметрично сбалансированные элементы помогают снизить шум от изображения и сделать его знакомым.
Режиссёры фильмов давно используют симметрию, как мощный инструмент для создания визуально стабильных кадров. Но баланса можно добиться и в несимметричных изображениях с помощью цветов, объектов, пространства и текстуры.
Чтобы сделать интерфейс сбалансированным, необходимо разместить элементы на холсте соответственно их весу, чтобы визуально стабилизировать все объекты, присутствующие на экране.
Баланс в пользовательском интерфейсе
Акцент (выделение)
Акцент используется в большинстве областей дизайна, включая архитектуру, ландшафтный дизайн и дизайн одежды. Кроме того, он активно используется в кинематографе. Создатели фильмов используют всевозможные методы, чтобы выделить объект, на который должны смотреть зрители.
Акцент – это стратегия, направленная на привлечение внимания зрителя к определенному элементу дизайна. Это может быть область контента, изображение, ссылка, кнопка и т. д.
В кино для создания акцента на элементе используется фокус, контраст и т. д. Это делается для того, чтобы рассказать часть истории, относящейся к выделенному объекту.
В UI дизайне также есть повествование. Когда мы хотим поместить элемент в фокус, мы выделяем его, используя один из нескольких методов.
Выделение элемента в UI дизайне
Иерархия
Каждый человек по-своему понимает смысл фильма. Наши выводы о фильме, зависят от того, какие фильмы мы смотрели долгое время, и от того, как они повлияли на нашу точку зрения. Режиссер не контролирует это, но, понимая простые модели поведения, он может контролировать, куда мы будем переводить взгляд с одной точки на другую.
Иерархия – это контроль визуальной информации посредством ее расположения или презентации, чтобы выделить главное. Она влияет на порядок, в котором человеческий глаз воспринимает увиденное.
В каждом фильме создатели применяют ту или иную форму иерархической схемы, чтобы переместить взгляд аудитории с одной точки на другую. Обычно это делается для того, чтобы рассказать историю в необходимом порядке.
Когда пользователи взаимодействуют через экраны, важно направить их внимание в правильном порядке. В хорошем дизайне элемент, который идет первым, должен иметь связь с последующим элементом, а любой последующий элемент должен быть связан со своим предшественником.
Большинство приложений и сайтов применяют этот принцип для размещения элементов в правильном порядке. Родительский элемент обычно помещается либо поверх дочернего, либо слева от него.
Элементы расположены в соответствии с иерархией
Повторение
Когда дело доходит до поиска закономерностей в неизвестных объектах, люди склонны придерживаться ритмов. Ритмы в изображении, звуке, видео формируются с помощью повторений в расположении элементов на экране.
Принцип повторения просто означает повторное использование в дизайне одних и тех же или похожих элементов. Повторение определенных элементов дизайна принесет ощущение единства, последовательности и связности.
Этот принцип важен в кино, как и в любой другой области дизайна. Режиссеры фильма используют повторение элементов для формирования визуального ритма. Паттерн – это просто повторение нескольких элементов дизайна, работающих во взаимодействии друг с другом.
Человек, разбирающийся в дизайне, может легко заметить, насколько красиво Кристоферу Нолану удается связать повествование с визуальным ритмом. В то время, как Уэс Андерсон делает больший акцент на ритме, даже не осведомленная об этих принципах аудитория, также может легко их увидеть.
Точно так же повторение в интерфейсах создает визуальный ритм, который помогает пользователю находить закономерности, тем самым заставляя пользователя оставаться на платформе, т.е. более активно с ней взаимодействовать. Списки, меню, сообщения и т. д. – вот примеры разделов, в которых повторение очевидно.
Повторение в пользовательском интерфейсе
Близость
Когда мы смотрим историю, важно понимать, что она собой представляет, чтобы определить ее смысл. Близость в кинематографе играет жизненно важную роль, когда что-то нужно отделить от всего остального, чтобы в данный момент сделать это центральным предметом.
Принцип близости – это процесс обеспечения того, чтобы связанные элементы дизайна были размещены вместе. Непосредственная близость указывает на то, что элементы связаны друг с другом и становятся одной визуальной единицей, которая помогает организовать или структурировать макет.
В кино это можно сделать с помощью цветов, техники фокусировки и расположения объектов. Режиссерам доступно другое измерение, поскольку им помогает ось Z.
Однако, несмотря на развитие 3D в интерфейсах, большинство из них использует 2D-макеты, поэтому они могут легко работать на любом экране. Таким образом, пространство, стили и формы становятся важными при формировании близости внутри объектов в интерфейсе.
Близость в пользовательском интерфейсе
Пропорция
Обычно на холсте может быть много элементов, занимающих любую часть экрана. Но необходимо убедиться, что количество места на холсте, которое они занимают в данный момент, имеет большое значение с точки зрения истории, это хороший дизайн!
Пропорция – это соотношение двух или более элементов в композиции и то, как они соотносятся друг с другом по размеру, цвету, количеству, степени, настройке и т.д.
Если конкретный элемент занимает больше места, чем необходимо, он напрямую влияет на иерархию и не может передать необходимую информацию. Персонажу или объекту предоставляется место на холсте, необходимое в данный момент для истории, также, как и элементам пользовательского интерфейса.
Было бы ужасно, если бы окно чата поддержки занимало ту же ширину, что и панель навигации, или если бы логотип Amazon занимал, то же пространство, что и строка поиска. Пропорция имеет прямую связь с иерархией. Они играют свою роль в поддержке друг друга по сюжетной линии.
Пропорции в UI дизайне
Вот так мы разобрали принципы визуального дизайна на примере фильмов. Упомянутые в этой статье киноленты, одни из моих любимых, и я рекомендую вам их посмотреть, если вы еще не сделали это. Я стараюсь подмечать эти принципы в любом фильме, который смотрю. Я бы порекомендовал вам следующее. Когда вы будете смотреть фильм или сериал, и вам понравится визуальный ряд, поставьте видео на паузу, и проведите быстрый анализ, почему он выглядит так хорошо, и есть ли в нем вышеперечисленные принципы дизайна. Думаю, теперь стало немного яснее, как взаимосвязаны все дисциплины дизайна.
Интересный факт: все шесть принципов существуют в пользовательских интерфейсах и упомянутых фильмах, даже если они не говорят о них напрямую. Если вы не заметили их, попробуйте еще раз, это весело.
Источник
Этот принцип важен в кино, как и в любой другой области дизайна. Режиссеры фильма используют повторение элементов для формирования визуального ритма. Паттерн – это просто повторение нескольких элементов дизайна, работающих во взаимодействии друг с другом.
Человек, разбирающийся в дизайне, может легко заметить, насколько красиво Кристоферу Нолану удается связать повествование с визуальным ритмом. В то время, как Уэс Андерсон делает больший акцент на ритме, даже не осведомленная об этих принципах аудитория, также может легко их увидеть.
Точно так же повторение в интерфейсах создает визуальный ритм, который помогает пользователю находить закономерности, тем самым заставляя пользователя оставаться на платформе, т.е. более активно с ней взаимодействовать. Списки, меню, сообщения и т. д. – вот примеры разделов, в которых повторение очевидно.
Повторение в пользовательском интерфейсе
Близость
Когда мы смотрим историю, важно понимать, что она собой представляет, чтобы определить ее смысл. Близость в кинематографе играет жизненно важную роль, когда что-то нужно отделить от всего остального, чтобы в данный момент сделать это центральным предметом.
Принцип близости – это процесс обеспечения того, чтобы связанные элементы дизайна были размещены вместе. Непосредственная близость указывает на то, что элементы связаны друг с другом и становятся одной визуальной единицей, которая помогает организовать или структурировать макет.
В кино это можно сделать с помощью цветов, техники фокусировки и расположения объектов. Режиссерам доступно другое измерение, поскольку им помогает ось Z.
Однако, несмотря на развитие 3D в интерфейсах, большинство из них использует 2D-макеты, поэтому они могут легко работать на любом экране. Таким образом, пространство, стили и формы становятся важными при формировании близости внутри объектов в интерфейсе.
Близость в пользовательском интерфейсе
Пропорция
Обычно на холсте может быть много элементов, занимающих любую часть экрана. Но необходимо убедиться, что количество места на холсте, которое они занимают в данный момент, имеет большое значение с точки зрения истории, это хороший дизайн!
Пропорция – это соотношение двух или более элементов в композиции и то, как они соотносятся друг с другом по размеру, цвету, количеству, степени, настройке и т.д.
Если конкретный элемент занимает больше места, чем необходимо, он напрямую влияет на иерархию и не может передать необходимую информацию. Персонажу или объекту предоставляется место на холсте, необходимое в данный момент для истории, также, как и элементам пользовательского интерфейса.
Было бы ужасно, если бы окно чата поддержки занимало ту же ширину, что и панель навигации, или если бы логотип Amazon занимал, то же пространство, что и строка поиска. Пропорция имеет прямую связь с иерархией. Они играют свою роль в поддержке друг друга по сюжетной линии.
Пропорции в UI дизайне
Вот так мы разобрали принципы визуального дизайна на примере фильмов. Упомянутые в этой статье киноленты, одни из моих любимых, и я рекомендую вам их посмотреть, если вы еще не сделали это. Я стараюсь подмечать эти принципы в любом фильме, который смотрю. Я бы порекомендовал вам следующее. Когда вы будете смотреть фильм или сериал, и вам понравится визуальный ряд, поставьте видео на паузу, и проведите быстрый анализ, почему он выглядит так хорошо, и есть ли в нем вышеперечисленные принципы дизайна. Думаю, теперь стало немного яснее, как взаимосвязаны все дисциплины дизайна.
Интересный факт: все шесть принципов существуют в пользовательских интерфейсах и упомянутых фильмах, даже если они не говорят о них напрямую. Если вы не заметили их, попробуйте еще раз, это весело.
Источник
Как сделать максимально качественную работу в короткие сроки
Недавно мне нужно было сделать презентацию компании перед важной встречей. Времени было мало. Я подумал, каким образом построить работу над этой задачей, чтобы точно успеть к сроку и сделать ее максимально качественно.
Сложность в следующем. Если на старте сильно погрузиться в дизайн презентации и подачу информации, могут получиться несколько красивых слайдов, но на всю презентацию не хватит времени. Но и с визуально слабой презентацией не хочется проводить встречу.
В ходе размышлений я выработал следующий метод:
Первым этапом (после написания текста) я просто раскидываю информацию по слайдам. В итоге довольно быстро получится готовая презентация, но без особого дизайна.
Второй этап — доработка стиля и подачи. Здесь я еже буду знать, что фактически презентация готова и могу использовать все оставшееся время, чтобы придать ей приятный вид.
В этом случае я избегаю популярной ошибки — слишком погрузиться в детали на старте, что приведет к срыву сроков и потере общей картины проекта.
—
Этот метод можно использовать в разных сферах. Сначала сделать проект полностью, но в среднем виде, а все оставшееся до дедлайна время использовать на доработку деталей.
Подумайте, где его можете применить вы.
Источник
Недавно мне нужно было сделать презентацию компании перед важной встречей. Времени было мало. Я подумал, каким образом построить работу над этой задачей, чтобы точно успеть к сроку и сделать ее максимально качественно.
Сложность в следующем. Если на старте сильно погрузиться в дизайн презентации и подачу информации, могут получиться несколько красивых слайдов, но на всю презентацию не хватит времени. Но и с визуально слабой презентацией не хочется проводить встречу.
В ходе размышлений я выработал следующий метод:
Первым этапом (после написания текста) я просто раскидываю информацию по слайдам. В итоге довольно быстро получится готовая презентация, но без особого дизайна.
Второй этап — доработка стиля и подачи. Здесь я еже буду знать, что фактически презентация готова и могу использовать все оставшееся время, чтобы придать ей приятный вид.
В этом случае я избегаю популярной ошибки — слишком погрузиться в детали на старте, что приведет к срыву сроков и потере общей картины проекта.
—
Этот метод можно использовать в разных сферах. Сначала сделать проект полностью, но в среднем виде, а все оставшееся до дедлайна время использовать на доработку деталей.
Подумайте, где его можете применить вы.
Источник
Medium
Как сделать максимально качественную работу в короткие сроки
Недавно мне нужно было сделать презентацию компании перед важной встречей. Времени было мало. Я подумал, каким образом построить работу…