Изскачащият прозорец на Shopify за мобилни устройства трябва да работи на малък екран, при променяща се лента на браузъра и с отворена екранна клавиатура. Офертата трябва да се разбира бързо, полетата да се попълват лесно, а бутонът за затваряне да се намира веднага. Проверете цялото взаимодействие — от появата до затварянето — а не само добре подредената екранна снимка в редактора.
Формулирайте кратко и пълно обещание
Нека заглавието има една ясна задача, а важните условия на офертата бъдат наблизо. Поискайте само минималната информация, нужна за абонамента. Ако събирате незадължително предпочитание, обяснете целта му и не превръщайте малкия прозорец във въпросник.
Използвайте формулярите на Sendvio, за да запазите последователни типографията и разстоянията спрямо магазина. Позволете на текста да преминава естествено на нов ред, вместо да смалявате всеки етикет, за да наложите настолния изглед върху тесен екран. По-дългата езикова версия може да изисква по-висок или по-опростен дизайн.
Поберете полезното съдържание, а не настолната композиция
На телефона поставете на първо място обещанието, важните условия, полето, бутона за изпращане и ясно видимия бутон за затваряне. Голямата декоративна снимка може да се смали или премахне, ако избутва формуляра извън видимата област. Клиентът не бива да превърта покрай илюстрацията на марката само за да разбере каква информация искате.
Позволете на контейнера да се разширява или превърта според нуждата, вместо да налагате фиксирана височина при променлив текст. Преведено заглавие, грешка при проверка или увеличен системен шрифт могат да изискват повече място. Ако дизайнът работи само когато всяко изречение е в най-краткия си вариант, той не е готов за реални клиенти.
Запазете същата йерархия и след опростяването. Премахването на излишна снимка е различно от премахването на важно условие на офертата. Краткият формуляр пак трябва да обяснява абонамента и стойността му. Не решавайте липсата на място със смаляване на текста за разрешение дотолкова, че формално да присъства, но да се чете трудно.
Оставете контрола у посетителя
Направете затварянето видимо и удобно за докосване. Проверете, че формулярът може да се използва с клавиатура и че фокусът не изчезва зад наложения прозорец. Съобщенията за грешка трябва да посочват проблема до съответното поле, без да изтриват вече въведеното.
Обмислете кога се появява прозорецът. Ако прекъсне посетителя, преди да разбере страницата, може да предизвика повече раздразнение, отколкото интерес. Изберете момент, подходящ за офертата, и проверете преживяването на нов посетител, завръщащ се абонат и човек, който вече пазарува.
Проверете изгледа с отворена клавиатура
Фокусирайте полето на реален телефон или в представителен тест на устройство. Проверете дали полето, съобщението за грешка, бутонът за изпращане и контролът за затваряне остават достъпни при отворена клавиатура. След това преминавайте между полетата и въведете дълъг текст. Видимата област в браузъра може да се променя при тези действия, затова екранна снимка преди въвеждане не е достатъчна.
При модален формуляр фокусът на клавиатурата трябва да влиза в диалоговия прозорец, да остава вътре, докато е отворен, и да се връща логично след затварянето му. Клавишът Escape трябва да затваря прозореца по очаквания начин, когато това се поддържа. Проверете и с подходяща за аудиторията помощна технология: само визуалното подравняване не показва дали етикетите на полетата и грешките се прочитат ясно.
Тествайте най-малкото реалистично състояние
Отворете формуляра на тесен телефон, фокусирайте всяко поле и изпратете валидни и невалидни данни. Завъртете устройството, увеличете текста и проверете съобщението за успешно изпращане. Уверете се, че затварянето връща посетителя към използваема страница.
Измервайте валидните абонаменти и последващата ангажираност заедно с процента на конверсия на формуляра. Дизайн, който събира адреси, като затруднява напускането на магазина, не е полезно подобрение. Формулярът трябва да предлага ясна възможност, без да пречи на пазаруването.
Проверете и повторната поява като част от дизайна. Човек, затворил прозореца, не бива да се сблъсква със същото прекъсване при всяка следваща смяна на страницата. Използвайте наличните настройки за показване и тествайте както нов, така и завръщащ се посетител. Завършилият абонамента си не бива да продължава да вижда покана за придобиване на абонати, която вече не съответства на статуса му.
Когато резултатите са слаби, разграничете видимостта от полезността. Формулярът може да събира малко адреси, защото офертата е неубедителна, моментът е натрапчив или техническа стъпка е повредена. Проверете тези причини, преди да го показвате по-агресивно. Най-доброто подобрение е формуляр, който хората могат удобно да разберат, попълнят или затворят и след това да продължат да пазаруват.