1 Remigusz Kaczewski [email protected] GSM: 609 86 77 05Projektowanie formularzy z wykorzystaniem darmowych narzędzi Visforms i Chronoforms Remigusz Kaczewski GSM:
2 Agenda Na co zwrócić uwagę podczas projektowania formularzy - UX Experience Komponenty do budowy formularzy Płatny czy darmowy Chronoforms i Visforms Trochę praktyki
3 UX Experience
4 Po co formularze? Kontakt z właścicielem strony Rejestracja użytkownika Wyszukiwanie informacji Ankieta Konkursy
5 Na co zwrócić uwagę podczas projektowania formularzyProsty – łatwy w obsłudze Czytelny – proste pytania Krótki Spersonalizowany Szybki Informuj i mów językiem korzyści Wzywaj do działania Wykorzystuj checkboxy Zapewnij wystarczającą liczbę przestrzeni Zbieraj zgodę - najlepiej w 2 klikach Nie rozpraszaj uwagi Bądź Mobile Friendly Testuj (test A/B) Podziękuj za wypełnienie -dwie strony z formularzem różniące się jednym elementem - obserwujemy użytkowników)
6 Najczęstsze błędy? Za długi Za krótki Nieczytelny
7 Formularze – KomponentyKomponenty płatne Komponenty darmowe Form Builder – 36$ JSN Uniform – 49$/69$ Breezing Forms 45$/65$/135$ Form Maker (Paypal) 30$/45$/60$ Chronoforms – 25$/35$/200$ 3/5/999 validation keys Chronoforms JSN Uniforms Form Maker (Paypal) Uniforms Visforms
8 Płatny czy darmowy? Do czego potrzebujemy?Jakie informacje chcemy pozyskać? Jaki mamy budżet? Jakie mamy umiejętności?
9 Chronoforms i VisformsKomponenty o dużych możliwościach Prosta i szybka konfiguracja - Visforms Bogate zaplecze techniczne - Chronoforms
10 Trochę praktyki
11 Trochę praktyki Jak zaprojektować formularz z autoresponderem?Na przykładzie Visforms (strzałkami zaznaczyłem miejsca, na które trzeba lub warto zwrócić uwagę)
12 Zapisać możemy na samym końcuTrochę praktyki Nazwa formularza Krok 1 – zakładamy formularz
13 Trochę praktyki Krok 2 – Zakładka ResultsW tym miejscu ustawiamy to co wyświetli się na stronie po wypełnieniu i wysłaniu formularza
14 Trochę praktyki Krok 3 – wybieramy zakładkę Mail OptionsPo ustawieniu parametrów formularza wybieramy pole Fields by zaprojektować poszczególne pola formularza Trochę praktyki Krok 3 – wybieramy zakładkę Mail Options są tu dwie części : - Options for result mail – tu ustawiamy parametry informacji, które trafią do nas – jako właścicieli strony – po wypełnieniu formularza - Options for recipient mail – tu ustawiamy parametry informacji, które trafią do osoby, która wypełniła formularz – pod warunkiem, że podała swój adres mailowy
15 Trochę praktyki Krok 4 – Pola formularzaPo ustawieniu parametrów formularza wybieramy w górnym menu przycisk Fields, który przeniesie nas do nowego okna, w którym projektujemy poszczególne pola formularza
16 Trochę praktyki O czym pamiętać?O włączeniu opcji – nie nam nie da poprawne jej skonfigurowanie jeśli jej nie włączymy O tym, że pokazałem tylko fragment, komponent ma naprawdę duże możliwości Nie każdy serwer pocztowy poprawnie działa (adres musi być w tej samej domenie co strona) zwróćcie uwagę, na poprawne umieszczenie adresów mailowych, z których wysyłacie informacje
17 Masz pytanie? Poszukaj instrukcji Przeszukaj forum Zapytaj praktyka (FB, forum) Zapytaj developera Możesz też zapytać mnie