Case study projektu strony "Biogazownia rolnicza - sprawa publiczna”: www.gmina.bio-gazownie.edu.pl. Najważniejsze zasady, którymi kierujemy się w naszej pracy, to: przejrzysty budżet, nieprzekraczalne terminy i gwarancja wsparcia technicznego. Zapoznaj się z kolejnymi etapami realizacji zadania, dobrymi praktykami w relacjach z klientem oraz danymi technicznymi.

1. Serwisy internetowe dla NGO
dobre praktyki, case study
na przykładzie projektu
“Biogazownia rolnicza - sprawa publiczna”
✔ Zespół ✔ Przygotowania ✔ Realizacja ✔ CMS i moduły
✔ RWD ✔ Podsumowanie ✔ Zarządzanie projektem
✔ Dajemy więcej ✔ Zaufali nam ✔ Referencje

2. Gotowi na wszystko :)
Zespół projektowy
MACIEJ CHMIELOWSKI
CEO, ux/marketing
8 lat w marketingu
(SEO, content marketing,
social media, growth hacking),
4 lata w UX, CRO (B2B &B2C)
Wybrane projekty:
Fleet Poland
Emalia Olkusz
ICEportal4 CMS (UX Leader)
DAMIAN ŚWIERK
Customer Account
Manager
Obsługa Klienta przy
wdrażaniu serwisów www
Wybrane projekty:
FDPA - Biogazownia
rolnicza sprawa publiczna
Dinofach.pl, Krakchemia.pl
JUSTYNA WOSZCZYNA
Creative director, web
designer
8 lat w (web) designie,
corporate identity, skład książek.
Wybrane projekty:
mcarthur.com.pl, e-lango.pl
lcmedia.pl, gospodarzzenergia.pl
kampinoskiebagna.pl, caewse.pl
KONRAD
programista
front-end developer
6-letnie doświadczenie
we wdrażaniu stron www
i programowaniu,
PHP, Javascript, jQuery,
HTML/HTML5, CSS3, XML
www.sita.edu.pl
www.kampinoskiebagna.pl
www.delphipoland.com

3. Przed podjęciem decyzji o współpracy
Etap I Case study
❏ Zapytanie od FDPA z opisem projektu:
❏ Na starcie sprecyzowany cel: stworzenie serwisu internetowego, który będzie
przejrzysty i łatwy w obsłudze dla samorządowców chcących zdobyć wiedzę
na temat biogazwoni
❏ Pierwszy krok: zaproponowanie szeregu możliwych rozwiązań do osiągnięcia celu
❏ Wprowadzenie zasady Pareto (z racji na specyfikę projektu) :
❏ 20% czasu poświęconego na analizę oczekiwań i przygotowanie oferty zostało
poświęcone na naszkicowanie na kartce papieru roboczej makiety kluczowej strony
całego serwisu www
❏ Rezultat zastosowania zasady Pareto [slajd 6]

4. Przed podjęciem decyzji o współpracy
Etap I Case study
❏ Dobór potrzebnych dla serwisu modułów
❏ Wysłanie kompleksowej oferty do FDPA
❏ Akceptacja wstępnego projektu przez FDPA
❏ Spotkanie organizacyjne
❏ doprecyzowanie oczekiwań klienta
❏ zasady promocji
❏ kwestie finansowe
❏ terminy
❏ zasady wsparcia technicznego
❏ Akceptacja udoskonalonej oferty przez FDPA
❏ Negocjacje oraz podpisanie umowy
❏ Rozpoczęcie prac nad serwisem

5. Realizacja projektu
Etap II Case study
Schemat przebiegu realizacji:

6. Szkic - makieta na kartce Makieta klikalna - UxPin Finalny projekt graficzny widoku artykułu
Makietowanie pojedynczego artykułu
Etap II Przygotowanie najważniejszego widoku serwisu

7. Wstępne projekty graficzne
Etap II Case study

8. Wdrożenie finalnego projektu
Etap II Case study
❏ Przedstawienie 2 indywidualnych, wstępnych projektów graficznych
❏ wdrożenie uwag do wybranego (2 tury)
❏ rozpoczęcie kodowania finalnego projektu na stronie
❏ Stworzenie logo projektu
❏ Prace programistyczne nad przygotowaniem specjalistycznych funkcji
❏ między innymi moduł publikacje - wielofunkcyjny moduł, przyjazny
dla wielu redaktorów
❏ Wprowadzenie treści publikacji
❏ zwiększanie atrakcyjności przez dobór zdjęć oraz wysokiej jakości
grafiki

9. Instalacja systemu ICEBERG CMS
Etap III
❏ Nowoczesny i przejrzysty interfejs – zarządzanie
stroną jest teraz jeszcze prostsze!
❏ Panel RWD - przystosowany do korzystania
na urządzeniach mobilnych
❏ Szybki dostęp - zagregowane funkcje ułatwiają
edycję modułów w jednym miejscu
❏ Indywidualne zarządzanie widokiem strony startowej
❏ Analityka - Najważniejsze statystyki strony

10. Instalacja modułów podstawowych
Etap III
Menu główne
Aktualności
Publikacje (artykuły)
Slider
Galeria zdjeć
Edytor tekstowy
TinyMCE
Wyszukiwarka
Mapa Google
Boksy dodatkowe,
tekstowo-graficzne
Newsletter
Formularz kontaktowy
Widgety social media

11. Programowanie modułów niestandardowych
Etap III
Zestaw rozwiązań dla sprawnej nawigacji i użytkowania strony:
❏ Rozwijane menu boczne ze strukturą rozdziałów
❏ Ścieżka dostępu (okruszki)
❏ FAQ
❏ Wyszukiwarka
❏ Chmurki z podpowiedziami
❏ Mapa strony
❏ Rejestracja i logowanie
❏ Dodanie do ulubionych
❏ Ostatnio przeglądane artykuły

12. Programowanie modułów niestandardowych
Etap III
Zaawansowany moduł „Publikacje”
❏ Nieograniczona liczba autorów (dostęp tylko do swojej sekcji)
❏ Drukowanie / pobieranie
❏ Tagi
❏ Zdjęcie główne artykułu
❏ Powiązane artykuły („zobacz też”)
❏ Komentarze
❏ Pytania do autorów
❏ Inne artykuły danego autora
❏ Krótkie adresy poszczególnych treści (sprzyjające pozycjonowaniu)

13. Dostosowanie do urządzeń mobilnych
Etap IV
❏ Wyzwanie
Aby w pełni wykorzystać potencjał swojej strony internetowej
nie wystarczy już strona zaprojektowana z myślą tylko
o komputerach. FDPA było tego świadome od początku.
❏ Rozwiązanie
Responsive Web Design (RWD) to technika projektowania,
dzięki której strona www automatycznie dopasowuje
się do wielkości ekranów różnych urządzeń.

14. Dostosowanie do urządzeń mobilnych
Etap IV
Efekt:
❏ wygodne przeglądanie treści witryny na laptopie, tablecie
czy telefonie komórkowym (smartfonie)
❏ Mechanizm działania RWD jest skuteczny, bo prosty: wraz
ze zmianą rozdzielczości ekranu zmienia się układ, rozmiar,
a nawet forma zawartości strony: tekstów, grafik, menu
❏ Witryna pozostaje zawsze czytelna, bez konieczności
niewygodnego przybliżania, oddalania czy przesuwania
na boki w urządzeniach mobilnych

15. Podsumowanie
Case study
❏ Czas realizacji: 45 dni [16.05 (podpisanie umowy)
01.07 (serwis gotowy do publikacji)]
❏ Dotrzymanie terminu określonego w umowie TAK
❏ System CMS TAK (ICEBERG CMS - autorski system Krakweb.pl)
❏ Liczba indywidualnych projektów graficznych 2 (każdy po 2 widoki: strona główna + artykuł)
❏ Dostosowanie do urzędzeń mobilnych TAK (Responsive Web Design)
❏ Makietowanie TAK (1 widok artykułu)
❏ Liczba roboczogodzin ok. 145
❏ Pozostałe:
❏ hosting,
❏ konfiguracja domeny, wsparcie techniczne (czas reakcji do 2h od zgłoszenia),
❏ gwarancja 12 miesięcy

16. Znamy i rozumiemy specyfikę pracy
zaufanie
wybór projektów graficznych także przy
wariancie z jednym indywidualnym
gwarancja + wsparcie techniczne
RWD - strona mobilna
doradztwo (użyteczność, grafika,
rozmieszczenie informacji,
struktura)
dotrzymywanie terminów
przejrzysta umowa
podstawowe logo projektu
osoba kontaktowa dedykowana
do projektu
szkolenie
łatwy w obsłudze system
CMS
dobór zdjęć i pomoc w zakupie z portali stockowych
pomoc przy opisie strony (np. technologie) do
złożenia wniosku
gwarancja nieprzekraczalnego budżetu
niestandardowe rozwiązania: rozbudowane
ankiety, sondy, mapy obiektów itp.
doradztwo w zakresie domeny, hostingu
Zapisy na eventy (konferencje, szkolenia) online
specyficzne warunki rozliczenia - czasem bez
możliwości zaliczki
dłuższe terminy za zgłoszenie uwag

17. Zarządzanie projektem
Prowadzimy projekty w:
❏ Asana.com <3
Asana.com pozwala na:
❏ komunikację w zespole projektowym,
❏ podział projektu na zadania,
❏ przypisanie zadań członkom zespołu + terminów
❏ monitorowanie postępów realizacji projektu
Asana.com pomaga w przygotowaniu, realizacji
i wdrożeniu projektu. Ułatwia jego kompleksową obsługę.

18. Zaufali nam

19. 1
2
3
4
“Jakość Państwa pracy oceniam bardzo wysoko, w szczególności terminowość.“
Marek Wiśniewski, Korporacja Samorządowa im. Józefa Dietla
“Dziękuję. Muszę przyznać, że pana "opieka" nad nami daje mi bardzo dobre
"customer experience" :)” Kamil Dudwał, MDT
“Elastyczność, profesjonalizm, szybkość działania, a przede wszystkim fachowa
pomoc w administracji systemem [...] polecamy Agencję Interaktywną Krakweb.pl
jako rzetelnego partnera.” Aleksandra Skawiniak, Genesis Consulting
Zaufali nam także: http://goo.gl/Ll6vZs
Mówią o nas

20. Zapraszamy do współpracy
Damian Świerk
✉ damian@krakweb.pl
☎ (+48) 530 555 521
☏ (12) 429-30-13
Agencja Interaktywna Krakweb.pl
www.krakweb.pl
www.marketing.4www.pl
ul. Rzemieślnicza 20/124B Kraków