Начать бесплатно
Одна правка в двух кадрах

Кейс редизайна до и после

Покажите одну видимую правку сайта на двух сопоставимых снимках. Одинаковые фрагмент, ширина и масштаб помогут заказчику увидеть, что вы изменили и какую задачу решали. Готовые кадры автор собирает в кейс ELL вручную.

Задача

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

Условный пример

Учебная ситуация для объяснения сценария.

До

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

После

Автор вручную готовит два снимка одной карточки с тем же товаром, шириной и масштабом. В новом блоке сумма залога стоит рядом с суточной ценой; отметки «До» и «После» включены в файлы. Пример общего описания: «Учебный редизайн карточки проката. Задача — показать залог там, где посетитель видит цену. Мой вклад — структура и оформление блока стоимости. В паре одинаковые товар, ширина и масштаб. После правки залог виден в карточке рядом с суточной ценой. Это учебный макет; влияние на обращения не измерялось.» Получатель видит конкретную правку и её границу.

Порядок действий

  1. Выберите одну правку и один участок сайта. Снимите исходное и новое состояния вручную при одинаковых ширине и масштабе, с тем же текстом и границами фрагмента. Включите отметки «До» и «После» в файлы; дополнительную деталь подготовьте такой же сопоставимой парой. Отберите до шести JPG, PNG или WebP, до 12 МБ на файл по подсказке редактора. Согласуйте показ клиентских материалов.
  2. Войдите в ELL и заполните «Об авторе»: публичное имя, специализацию и нужные контакты. Нажмите «Сохранить профиль» и дождитесь подтверждения; для существующего профиля сохраните изменения, если они были. Проверьте доступный лимит работ, затем откройте «Добавить работу», выберите «Тип работы» — «Дизайн» и способ «Скриншоты».
  3. Назовите кейс по видимой правке, например «Учебный редизайн карточки проката». В едином поле «О задаче и результате» за 800 символов объясните проблему, решение, свою роль и стадию проекта. Добавьте подготовленные кадры и стрелками расположите каждый исходный перед соответствующим новым. Отдельные подписи состояния оставьте внутри файлов.
  4. Нажмите «Сохранить работу» и дождитесь окончания загрузки. В предпросмотре проверьте порядок пары, читаемость отметок и сохранение сопоставимого масштаба; изображения могут уменьшаться и перекодироваться. Перед передачей ссылки отдельно проверьте видимость кейса, доступ к профилю и одобрение портфолио. По снимкам описывайте видимую правку; деловые результаты требуют своих данных.

Проверить перед завершением

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

Ограничения и условия

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

Вопросы и ответы

Чем этот кейс отличается от набора экранов?

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

Будет ли автоматическое сравнение до и после?

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

Как обозначить состояния без отдельных подписей?

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

Можно ли назвать правку успешной по двум кадрам?

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

Покажите правку, которую можно разобрать

Начните с одной сопоставимой пары и короткого объяснения решения. Проверьте порядок и читаемость после сохранения, затем доступ к странице перед передачей ссылки.

Оформить кейс редизайна

Быстрое действие

Новый постПроверить SEOСжать фотоСайт работает?Презентация