Losowanie jednego z dwóch kolorów, nagłówków i obrazków

Jak to czasami z projektami bywa, często nie wiemy jak się za nie zabrać, dlatego zwlekałam parę dni z napisaniem jakiejkolwiek linii kodu. Kontuzja kostki skutecznie mnie unieruchomiła i zmusiła do siedzenia (przed monitorem). Odpaliłam Codepena i zaczęłam się zastanawiać. Zdecydowałam, że spróbuję stworzyć skrypt, który będzie losował jeden z dwóch danych kolorów. Pisałam już kiedyś program, który randomowo losował kolor na kliknięciu, ale cel mojego skryptu był inny. Poprosiłam wujka Googla o podpowiedź.

Jak wylosować jedną z dwóch liczb używając JavaScriptu?

How to decide between two numbers randomly using JavaScript?

Na StackOverflow (portal na którym programiści publikują swoje problemy, a inni pomagają im w ich rozwiązaniach) znalazłam dokładnie to co było mi potrzebne. Plan był taki:

  1. Wylosuj randomową liczbę [0, 1) używając Math.random()
  2. Przypisz ją do zmiennej
  3. Jeśli wylosowana liczba będzie mniejsza od 0,5 wybierz wartość 1.
  4. W pozostałych przypadkach wybierz wartość 2.

Udało mi się na początku napisać skrypt w jQuery, następnie w czystym JavaScript. Cóż za satysfakcja! Tego samego dnia udało mi się napisać skrypt losujący treść nagłówka oraz obrazek. Przyjęłam założenie, że w tym samym czasie może być testowany tylko jeden element danego rodzaju. Wybierany on jest za pomocą odpowiedniego ID. Będę jeszcze usprawniać ten kod. Jeśli chcesz zerknąć na najnowszą wersję tego kodu zapraszam na razie na mojego Codepena.

screenshot from Codepen
Każdy element losuje się osobno na odświeżeniu przeglądarki

 

screenshot from Codepen
Wynik kolejnego losowania

Problemy:  

Nie wiem jeszcze jak połączyć Gita z Githubem, dlatego zaczęłam programować w Codepenie. Jeszcze większy problem mam z komputerem, ponieważ mam za mało pamięci i nie mogę niczego zainstalować, co utrudnia całą sprawę.

 

 

Mój program do testów A/B – faza przygotowania i planowania

A/B tests image

W ramach konkursu Daj się Poznać 2017 zdecydowałam się napisać swój własny opensourcowy program, który umożliwi przeprowadzanie testów A/B na stronach internetowych. Zaczęłam od przeczytania pełnej interesujących przykładów książki pt. “Testy A/B od kliknięcia do klienta”, której autorami są: Dan Siroker i Pete Koomen.

Następnie wypisałam elementy które można testować na stronach internetowych:

  1. tekst
  2. kolor tekstu, buttonów, linków
  3. display
  4. większe elementy layoutu
  5. obrazy
  6. wideo
  7. ilość pól w formularzu
  8. kolejność elementów
  9. położenie elementu
  10. inne: font-size, font-family, border-radius itd.

Założyłam również konto i repozytorium na GitHubie (po raz pierwszy sama!). Zaczęłam się zastanawiać co będę potrzebować do dalszej pracy. Zamierzam używać JavaScript oraz jQuery. Żeby przeprowadzać testy będę musiała losowo wybierać jeden z testowanych wariantów.

Testowanie testów – czyli jak będę sprawdzać czy mój program działa dobrze?

Z książki pt. “Testy A/B od kliknięcia do klienta” wyciągnęłam bardzo cenną radę. Jak sprawdzić czy mój program działa prawidłowo? Będę musiała przeprowadzić Test A/A – czyli testować dwa takie same warianty. Jeśli wyniki będą do siebie zbliżone będzie to oznaczać, że kod działa prawidłowo.

Testy A/B – co to takiego?

Testy A/B zaczynają się od prostego pytania:

W jaki sposób mogę poprawić konwersję na mojej stronie internetowej / aplikacji?

Innymi słowy: 

Jak zwiększyć odsetek ludzi, którzy na naszej stronie np. wypełnią formularz, zapiszą się na newsletter, kupią nasz produkt, przekażą darowiznę?

W rozwiązaniu tego problemu przychodzą testy A/B. Polegają one na wyświetlaniu użytkownikom w tym samym czasie różnych wersji poszczególnych elementów strony internetowej i porównywaniu wyników określonego wcześniej współczynnika. Ważne jest aby użytkownicy byli z tej samej grupy docelowej, aby wyniki były jak najmniej zaburzone.

Ciekawostka: Zespół Baracka Obamy korzystał z testów A/B podczas kampanii prezydenckich, oczywiście jak wszystkim wiadomo końcowy rezultat był pozytywny.

A/B tests image
Frangemnt książki „Testy A/B od kliknięcia do klineta”

Istnieje wiele platform, które umożliwiają przeprowadzanie testów A/B np.: https://www.optimizely.com. Ja natomiast w ramach nauki programowania JavaScript i jQuery postanowiłam napisać swój program, który będzie do tego służył. Przez najbliższe kilka tygodni będziecie mogli śledzić moje postępy w pracy.

Blog SowaProgramuje – 3… 2… 1… start!

Tradycyjne Hello World – czyli mój pierwszy post na blogu SowaProgramuje.

Będę pisać o:

  • zdobywaniu doświadczenia jako programistka (JavaScript),
  • dobrych praktykach kodowania,
  • wyzwaniach i realizacji projektu w ramach konkursu “Daj się Poznać 2017”,
  • testach A/B na stronach internetowych,
  • freelancingu,
  • rozmowach kwalifikacyjnych w branży IT
  • i wiele więcej 😉

DajSiePoznać - logo