Задачка: регистрация с фото и паспортом
На днях я предложил читателям «канала» такую задачку:
На просторах фейсбука встретил скрины регистрации в довольно типичном приложении, которому надо идентифицировать человека. Так обычно работают каршеринги и всяки уберо-подобные сервисы, которым не обойтись просто электронной почтой.
Интерфейс достаточно аккуратный, явно делал дизайнер. Но, думаю, есть что улучшить. Попробуем?
Спасибо всем, кто прислал свои варианты! Давайте разберём решение. Начнём с исправления проблем в существующем интерфейсе, а закончим альтернативными вариантами.
Будем исходить из того, что и личное фото, и фото паспорта действительно нужны сервису (допустим, юристы требуют). В противном случае решение было бы слишком простым ツ
Редизайн: личное фото
Непонятно, зачем на первом экране крестик, да ещё в левом верхнем углу. Если фото требуется для продолжения регистрации, какой смысл закрывать? Если это возврат к предыдущему шагу, то для него на Андроиде есть кнопка «назад».
Сначала кажется, что инструкция предельно понятна: «загрузите личное фото». Полагаю, надо ткнуть на изображение камеры и сделать селфи. Но зачем тогда внизу кнопка «добавить фото»? Из текста под заголовком становится понятно, что можно загрузить уже готовое фото.
Это плохо: мы сразу перегрузили экран и усложнили пользователю жизнь, поставив его перед выбором. Очевидно, что большинство пользователей не держат под рукой готовое фото. Поэтому лучше просто предложить сделать селфи, а уже на экране селфи дать возможность загрузить файл:
Предлагаем сделать селфи…
…и делаем его
В поясняющем тексте было много мусора. «Пожалуйста» лишнее, «для продолжения регистрации» — тоже. Требование загрузки в формате .jpg — просто абсурд. А поскольку мы убрали вариант с загрузкой, от пояснения удалось целиком избавиться.
Редизайн: фото паспорта
Текст под заголовком повторяет очевидное — из заголовка и следующих двух блоков и так понятно, что надо сделать.
Непонятно, зачем разноцветные блюры на фотографиях. Пока фото не сделано, лучше показывать схематичное изображение разворота паспорта. Когда сделано — его и показывать.
Крестик удаления фото микроскопический — сложно будет попасть пальцем. Да и зачем удалять фотографию? Если получилась неудачная, можно просто переснять.

Схематичные изображения страниц помогут открыть нужный разворот паспорта
Альтернатива: отдельные экраны
С первым экраном (личное фото) есть проблема: он предлагает лишнее действие. Можно без потери смысла фотографировать сразу на нём. Тогда логично и фото паспорта разнести по отдельным экранам. Такой вариант предложил Алексей Демьяновских (макеты участника с моими правками):
Альтернатива: длинный экран
Возможно, при регистрации помимо фотографий требуются и другие данные. Если приложение не умеет распознавать текст с фотографий, то придётся указывать и ФИО, и дату рождения, и номер-серию паспорта вручную. Это значит, что получается минимум три экрана: текстовые данные, личное фото, фото паспорта.
Можно упаковать всё в один длинный экран. Чуть менее наглядно, но зато сразу видно всё, что требует приложение для регистрации. И легко вернуться к предыдущему шагу. Пример из приложения Belka Car:
Вводим персональные данные…
…и делаем фото
Ну или хотя бы сделать общий экран с фотографиями. Макет прислал анонимный участник:

Первым экраном могут быть текстовые данные, вторым — фото документов
Если оставлять отдельные экраны, хорошо бы добавить индикатор прогресса («шаг 2 из 3»). На это указали многие участники, а Антон Лютиков отрисовал весь сценарий:
Приложение распознаёт текст с фото документов и предлагает исправить, если что-то не так
Альтернатива: чат
Олег Бухтияр обратил внимание на вариант с «чат-ботом», который использует Яндекс.Драйв:
Бот пишет короткими простыми фразами, как это обычно делают люди в чатах
Это, пожалуй, самый естественный по нынешним временам вариант. Бот пишет конкретные короткие указания, пользователь выполняет. Ошибиться почти невозможно. Отсюда и минусы:
- невозможно вернуться к предыдущему шагу,
- непонятно, сколько ещё шагов впереди.
Бизнес-логика: пропустить шаги
Слава Соколов справедливо заметил:
Должна быть возможность пропустить шаги с добавлением фотографий. Человек сможет пользоваться приложением, просто не все функции будут доступны. Актуально, если, например, паспорта под рукой нет.
Если разработчики не готовы «пустить» человека в приложение до проверки паспорта, стоит хотя бы сохранять уже введённые данные — и не требовать их, когда пользователь через два дня вернётся с паспортом.
Было ещё несколько предложений, которые не кажутся мне удачными:
- Брать личное фото из паспорта. Паспорт действует 25 лет и больше, люди на фото мало похожи на себя нынешних. Да и фото там так себе. Если брать откуда-то готовое фото, я бы скорее предложил соцсети (заодно и ФИО получаешь автоматом).
- Регистрация через Госуслуги (ЕСИА). Вообще, идея богатая. Коммерческие компании действительно могут использовать «Единую систему», чтобы идентифицировать пользователей (причём это юридически значимая идентификация). Но пока на Госуслугах зарегистрировано только 50% взрослого населения (в 2018 собираются довести до 70%). Так что регистрация через Госуслуги как единственный вариант не подойдёт.
Ещё раз спасибо всем участникам! Мы продолжим ツ
Подписывайтесь на канал, чтобы не пропустить новые заметки
Идентификация водителя — Фотоконтроль паспорта
Теперь Яндекс Такси собирает паспортные данные водителей, утверждая, что подобная мера сделает поездки более безопасными.
Как пройти идентификацию
В Таксометр придёт запрос на проверку паспорта — «Идентификация» в «Фотоконтроле». Вероятно, уже существующего Фотоконтроля автомобиля (ДКК) и Фотоконтроля СТС (СРТС) недостаточно, теперь ещё нужен фотоконтроль паспорта водителя.

Нажмите на «Идентификация», и вы перейдёте в раздел проверки документов. Сначала дайте согласие на обратку персональных данных — поставьте напротив галочку. Если галочку не поставить, то пройти идентификацию будет невозможно.

После этого сделайте три фотографии документа хорошего качества: главный разворот с фото, селфи с документом в развёрнутом виде и страницу с пропиской.
Главный разворот с фото

Разворот с пропиской

Селфи с открытым документом

Если все фотографии получились читаемыми, то нажмите кнопку «Отправить». Если нужно переделать какое-то фото — нажмите на него и сделайте новую фотографию. На сделанных фотографиях в обязательном порядке должны быть видны и хорошо читаться:
- Серия и номер документа,
- Дата выдачи,
- Орган, выдавший документ,
- Код подразделения,
- Дата окончания (если есть),
- Прописка.
Как сделать правильное фото
Пройти Идентификацию можно только отправив качественное фото паспорта, для этого необходимо:
- Сделать фото при хорошем освещении.
- В границы фото (во время съёмки — это прямоугольник на экране) должен помещаться весь разворот документа, а не только часть. Если это селфи с документом — то ваше лицо тоже должно быть в границах овала.
- Не фотографируйтесь в головных уборах или с предметами, которые закрывают лицо.
- Фотографируйте так, чтобы основный текст был горизонтальным.
Как нельзя делать
- Фотографировать слишком близко,
- Фотографировать вертикально,
- Присылать фото копий документов,
- Фотографировать издалека,
- Фотографировать другой документ (не паспорт),
- Фотографировать со вспышкой.
Кто проверяет данные
Как всегда, проверка введенных данных довольно затратна по времени, и осуществляется с помощью сервиса Яндекс.Толока.
Если не пройти идентификацию
Если не выполнить идентификацию, то заказы Яндекс Такси перестанут поступать.
Понравилось? Также у нас написано про это:
Идентификация водителя — Фотоконтроль паспорта: 2 комментария
Так а уже же это было, я когда сдавал экзамен в тариф эконом как раз делал такие фотографии с паспортом у лица. Было это в центре Яндекса для водителей, как сейчас помню.
А теперь идентификация будет не только в центре для водителей, но и в каждом таксометре страны
Разворот с фото паспорта как понять
Что написано на первой и второй странице паспорта гражданина РФ?
Обычный паспорт гражданина Российской Федерации снаружи выглядит так:

Но это так называемая "корочка" или обложка. А вот первой страницей является страница, на которой изображен герб России и имеется надпись: "ПАСПОРТ ГРАЖДАНИНА РОССИЙСКОЙ ФЕДЕРАЦИИ":

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

Ах да, еще на второй странице имеются надпись "РОССИЙСКАЯ ФЕДЕРАЦИЯ" и серия и номер паспорта.
Ответ № 226 от 24 дня месяца Октября 2021 г.
Чтобы узнать, что написано на первой и второй странице паспорта гражданина РФ буду действовать следующим образом.
Открываю паспорт свой, в котором указано последовательно следующее:
1) На стр. 1 цветное изображение Государственного герба Российской Федерации, ниже герба напечатано: паспорт гражданина Российской Федерации (прописными буквами) и какие-то орнаменты.
2) На стр. 2 Российской Федерации (прописными буквами), Паспорт выдан (соответствующий ОВД), Дата выдачи (день, месяц, год), Код подразделения (соответствующий), Личный код (отсутствует), Автограф должностного лица, печать паспортно-визовой службы МВД России, личная подпись, якобы серея и номер.
Далее захожу в информационно-телекоммуникационную сеть «Интернет» через соответствующий поисковик браузера по ссылке адреса сайта http://www.consulta nt.ru/document/cons_ doc_LAW_15101/51d3a2 d43a726e22847dd3be33 f75c45c756b8a7/ ЗАО «Консультант Плюс» (информация из бизнес-регистра ЕГРЮЛ OGRN: 1027739125908).
По данной ссылке адреса сайта обнародовано Описание бланка паспорта гражданина Российской Федерации, утв. постановлением Правительства РФ от 8 июля 1997 г. N 828 (Текст постановления опубликован в "Российской газете" от 16 июля 1997 г., в Собрании законодательства Российской Федерации от 14 июля 1997 г., N 28, ст. 3444).
В силу названного Описания бланка паспорта указано следующее.
Таким образом мы узнали, что написано на первой и второй странице паспорта юридически и фактически, в связи с чем есть разночтения в части печати "паспорт гражданина Российской Федерации" или "ПАСПОРТ ГРАЖДАНИНА РОССИЙСКОЙ ФЕДЕРАЦИИ".
Идентификация водителя — Фотоконтроль паспорта
Теперь Яндекс Такси собирает паспортные данные водителей, утверждая, что подобная мера сделает поездки более безопасными.
Как пройти идентификацию
В Таксометр придёт запрос на проверку паспорта — «Идентификация» в «Фотоконтроле». Вероятно, уже существующего Фотоконтроля автомобиля (ДКК) и Фотоконтроля СТС (СРТС) недостаточно, теперь ещё нужен фотоконтроль паспорта водителя.

Нажмите на «Идентификация», и вы перейдёте в раздел проверки документов. Сначала дайте согласие на обратку персональных данных — поставьте напротив галочку. Если галочку не поставить, то пройти идентификацию будет невозможно.

После этого сделайте три фотографии документа хорошего качества: главный разворот с фото, селфи с документом в развёрнутом виде и страницу с пропиской.
Главный разворот с фото

Разворот с пропиской

Селфи с открытым документом

Если все фотографии получились читаемыми, то нажмите кнопку «Отправить». Если нужно переделать какое-то фото — нажмите на него и сделайте новую фотографию. На сделанных фотографиях в обязательном порядке должны быть видны и хорошо читаться:
- Серия и номер документа,
- Дата выдачи,
- Орган, выдавший документ,
- Код подразделения,
- Дата окончания (если есть),
- Прописка.
Как сделать правильное фото
Пройти Идентификацию можно только отправив качественное фото паспорта, для этого необходимо:
- Сделать фото при хорошем освещении.
- В границы фото (во время съёмки — это прямоугольник на экране) должен помещаться весь разворот документа, а не только часть. Если это селфи с документом — то ваше лицо тоже должно быть в границах овала.
- Не фотографируйтесь в головных уборах или с предметами, которые закрывают лицо.
- Фотографируйте так, чтобы основный текст был горизонтальным.
Как нельзя делать
- Фотографировать слишком близко,
- Фотографировать вертикально,
- Присылать фото копий документов,
- Фотографировать издалека,
- Фотографировать другой документ (не паспорт),
- Фотографировать со вспышкой.
Кто проверяет данные
Как всегда, проверка введенных данных довольно затратна по времени, и осуществляется с помощью сервиса Яндекс.Толока.
Если не пройти идентификацию
Если не выполнить идентификацию, то заказы Яндекс Такси перестанут поступать.
Понравилось? Также у нас написано про это:
Идентификация водителя — Фотоконтроль паспорта: 2 комментария
Так а уже же это было, я когда сдавал экзамен в тариф эконом как раз делал такие фотографии с паспортом у лица. Было это в центре Яндекса для водителей, как сейчас помню.
А теперь идентификация будет не только в центре для водителей, но и в каждом таксометре страны
Что такое разворот с фотографией
Разворот с фотографией — это эффект, который позволяет создать впечатление открытия страницы книги или альбома с помощью фотографии. Этот прием широко используется в дизайне и печати, чтобы привлечь внимание читателя и усилить эмоциональное воздействие. Он может быть использован для создания визуально привлекательных обложек для книг, альбомов, брошюр и других различных изданий.
Для создания разворота с фотографией необходимо учесть несколько особенностей. Во-первых, фотография должна быть высокого разрешения и качества, чтобы она выглядела четкой и яркой при увеличении. Во-вторых, фото должно иметь достаточное пространство вокруг себя, чтобы можно было добавить текст и другие декоративные элементы. В-третьих, нужно использовать подходящие инструменты и программное обеспечение для создания разворота и его рендеринга.
Существует несколько способов создания разворота с фотографией. Один из них — использование графических редакторов, таких как Adobe Photoshop или GIMP. С их помощью можно создать фотографию с эффектом разворота и добавить текст и другие элементы дизайна. Другой способ — использование программных пакетов для верстки, таких как Adobe InDesign или Microsoft Publisher. Они предлагают специальные инструменты и функции для создания разворотов и вставки фотографий.
Разворот с фотографией — это мощный дизайн-элемент, который может быть использован для привлечения внимания к изданию и создания визуально привлекательного оформления. Он позволяет создать эффект открытия страницы книги или альбома и усилить воздействие фотографии на читателя или зрителя.
Разворот с фотографией: создание стильного эффекта
Разворот с фотографией – это эффект, который добавляет интерактивности и эстетичности к веб-страницам. Этот эффект позволяет пользователю видеть изображение или информацию с двух сторон при наведении или клике. Создание такого эффекта отлично подходит для создания интерактивных галерей, карточек продуктов или презентаций.
Для создания стильного эффекта «разворот с фотографией» можно использовать различные техники и инструменты:
- HTML и CSS: Эффект можно создать с использованием HTML и CSS, применяя трансформации и переходы. Например, можно создать блок с изображением, а затем с помощью CSS добавить трансформацию переворачивания при наведении или клике.
- JavaScript и библиотеки: Для создания более сложных эффектов разворота с фотографией можно использовать JavaScript и специальные библиотеки, такие как Flip.js, Turn.js и другие.
Важно помнить, что при создании разворота с фотографией необходимо учитывать пользовательский опыт и загружать изображения с оптимальным размером для быстрой загрузки страницы.
Кроме того, для достижения стильного эффекта рекомендуется использовать качественные изображения с яркими и насыщенными цветами, а также эффектные фоновые элементы и шрифты.
Использование анимаций и плавных переходов также поможет усилить впечатление от разворота с фотографией. Например, можно добавить эффекты затухания или перемещения изображения при разворачивании или сворачивании.
Создание стильного эффекта «разворот с фотографией» требует творческого подхода и экспериментов с различными компонентами дизайна и интерактивности. Важно помнить, что главной целью данного эффекта является создание приятного и запоминающегося пользовательского опыта.
Почему разворот с фотографией актуален?
Разворот с фотографией – это эффектный способ оформления страницы, который привлекает внимание читателя и создает интересующий контент. Вот несколько причин, почему разворот с фотографией является актуальным:
- Визуальная привлекательность: Разворот с фотографией позволяет создать уникальный дизайн, усилить визуальную привлекательность страницы и сделать ее более запоминающейся.
- Усиление эмоциональной связи: Фотографии имеют силу передачи эмоций и создания связи с читателем. Размещение фотографии в развороте позволяет усилить эмоциональную связь и вовлеченность читателя в материал.
- Подчеркивание ключевых моментов: Разворот с фотографией может использоваться для подчеркивания ключевых моментов текста или иллюстрации на странице. Это может быть полезно при создании обложек журналов, рекламных материалов или других визуально значимых страниц.
- Улучшение пользовательского опыта: Разворот с фотографией может органично дополнить контент страницы и сделать ее более интересной для читателя. Это в свою очередь улучшит пользовательский опыт и, возможно, привлечет больше посетителей на ваш сайт или блог.
Поэтому, использование разворота с фотографией является актуальным и может быть эффективным способом усилить впечатления от визуальных материалов и контента на странице.
Тренды в создании разворотов с фотографией
Создание разворотов с фотографией — это популярная и эффективная техника, применяемая в дизайне и маркетинге. Она позволяет привлечь внимание к контенту, создать эмоциональную связь с аудиторией и передать нужную информацию.
В последние годы наблюдаются определенные тренды в создании разворотов с фотографией, которые помогают улучшить визуальное впечатление и достичь желаемых целей:
- Минимализм. Современные развороты с фотографией часто используют минималистичный подход, сосредотачиваясь на одной сильной фотографии и минимальном количестве текста. Это создает эффект стильности и чистоты, привлекая внимание к ключевой идеи или продукту.
- Видео-развороты. Трендом последних лет стали видео-развороты, где фотография дополняется движением и звуком. Они позволяют создать динамичный эффект, увлечь зрителя и эффективно передать настроение или историю.
- Геометрический дизайн. Использование геометрических форм и композиций в разворотах с фотографией помогает создать уникальный и современный вид. Такой подход добавляет интерес и движение к статичной фотографии, привлекая внимание к деталям и создавая глубину.
- Эффект прозрачности. Использование прозрачных элементов в разворотах с фотографией добавляет легкости и воздушности. Это может быть простое перекрытие текстом или размытость фона, позволяющая сделать фокус на главном объекте.
- Типографика. Креативное использование типографических элементов в разворотах с фотографией помогает привлечь внимание к тексту и акцентировать его значение. Типографические приемы, такие как изменение размера, цвета, шрифта или выравнивания, способствуют созданию эффектной композиции.
Тренды в создании разворотов с фотографией постоянно меняются и развиваются. Они предлагают дизайнерам и маркетологам новые возможности для создания эффектных и привлекательных разворотов, которые не только визуально выделяются, но и эффективно коммуницируют с аудиторией.
Примеры эффектных разворотов на сайтах
Разворот с фотографией — это эффектный способ добавить интерактивности и привлекательности к вашему веб-сайту. Ниже представлены несколько примеров использования разворотов на сайтах:
Галерея изображений с разворотом:
На сайте фотографа можно видеть галерею изображений, где каждое изображение разворачивается при наведении курсора. Это позволяет пользователю более детально рассмотреть фотографию и создает интерактивный опыт.
Переворачиваемый меню:
Сайты ресторанов и кафе могут использовать эффект разворота для создания впечатляющего и оригинального меню. При наведении курсора на элемент меню, изображение блюда может развернуться, показывая дополнительную информацию, такую как описание, ингредиенты и цены.
Интерактивные брошюры и книги:
Онлайн-брошюры и книги могут использовать эффект разворота страницы для создания реалистичного визуального опыта. Когда пользователь перелистывает страницы, они разворачиваются и отображают новый контент или изображение на обратной стороне.
Возможности креативного использования разворотов на веб-сайте практически неограничены. Этот эффект добавляет динамизм и интерактивность к вашим страницам, привлекая внимание пользователей и создавая запоминающийся пользовательский опыт.
Как создать разворот с фотографией в HTML и CSS
Для создания разворота с фотографией в HTML и CSS можно использовать различные методы и техники. Рассмотрим один из них:
- Создайте контейнер, в котором будет располагаться разворот. Для этого можно использовать тег <div> и задать ему соответствующие стили.
- Внутри контейнера создайте две области, которые будут представлять переднюю и заднюю части разворота. Для этого можно использовать два тега <div> и задать им соответствующие стили.
- Разместите фотографию внутри передней части разворота. Для этого можно использовать тег <img> и указать путь к изображению в атрибуте src.
- Добавьте стили, чтобы фотография занимала всю площадь передней части разворота. Можно использовать свойство background-size: cover или object-fit: cover.
- Добавьте стили, чтобы задняя часть разворота была скрыта. Можно использовать свойство transform: rotateY(180deg) или display: none.
- Добавьте анимацию разворота с помощью CSS. Для этого можно использовать свойства transition и transform.
Таким образом, вы создадите разворот с фотографией, который можно будет анимированно раскрыть и закрыть с помощью CSS.
Важные аспекты при создании разворота с фотографией
Разворот с фотографией является эффективным способом привлечь внимание читателя и передать ему информацию. Он используется в различных сферах, включая печатные издания, рекламу, дизайн и на сайтах. При создании разворота с фотографией следует учесть несколько важных аспектов, чтобы достичь максимальной эффективности сообщения.
- Выбор подходящей фотографии:
- Фотография должна быть высокого качества и хорошо передавать идею или настроение сообщения.
- Необходимо учесть цветовую гамму и композицию, чтобы фотография гармонично вписывалась в оформление разворота.
- Оригинальный дизайн и композиция:
- Дизайн разворота должен быть привлекательным и привлекать внимание читателя.
- Необходимо учесть расположение фотографии на развороте и её взаимодействие с текстом.
- Размер и формат фотографии также имеют значение, в зависимости от целей и формата публикации.
- Осмысленное сочетание фотографии и текста:
- Текст, который сопровождает фотографию, должен быть ясным и лаконичным, передавать главную идею.
- Необходимо учесть взаимодействие цвета и шрифта текста с фотографией, чтобы достичь гармонии и хорошей читабельности.
- Смысловая связь с остальной частью публикации:
- Разворот с фотографией должен быть логически связан с другими страницами или разделами публикации.
- Необходимо учесть контекст и цель публикации, чтобы разворот с фотографией вписывался в общую концепцию.
Успешное создание разворота с фотографией требует внимания к деталям и умения сочетать графические и текстовые элементы. При правильном подходе разворот с фотографией может стать сильным средством коммуникации и значительно усилить впечатление от публикации.
Вопрос-ответ
Что такое разворот с фотографией? Как его создать?
Разворот с фотографией – это вид дизайна, при котором изображение занимает две половины открытки. Чтобы создать разворот с фотографией, нужно выбрать подходящее изображение, разделить его на две части и разместить на открытке так, чтобы они соединялись после разворота.
Как выбрать подходящую фотографию для разворота?
При выборе фотографии для разворота стоит учесть цветовую гамму, композицию и содержание изображения. Фотография должна быть привлекательной и передавать нужное настроение. Также важно, чтобы она можно было разделить на две равные части, которые будут соединяться после разворота.
Как создать эффектное соединение двух половин фотографии?
Для создания эффектного соединения двух половин фотографии можно использовать различные методы. Например, можно продолжить композицию обоих частей на обратной стороне открытки, чтобы они визуально перетекали друг в друга. Также можно создать переход с помощью градиента или плавного затемнения.
Какие программы можно использовать для создания разворота с фотографией?
Для создания разворота с фотографией можно использовать различные программы. Например, Adobe Photoshop позволяет разделить изображение на две части и внести необходимые изменения. Также можно воспользоваться специализированными программами для дизайна открыток, которые предлагают шаблоны и инструменты для создания разворотов.
Какие еще способы можно использовать для создания разворота с фотографией?
Помимо разделения изображения на две части, можно использовать другие способы для создания разворота с фотографией. Например, можно использовать креативные рамки или коллажи, где изображение будет обрамлено другими элементами. Также можно экспериментировать с форматом открытки, используя нестандартные размеры или формы.
