o nas

taat.pl
Przedstawiamy cztery wybrane rezalizacje projektw. wiktorczyk.com.pl str. 3-21 asp.katowice.pl str. 22-32 cms.taat.com.pl str. 33-52 kapias.pl str. 53-60

spis treci

Najlepiej oglda na penym ekranie

o nas

taat.pl
Specjalici od kompleksowej realizacji stron www, od projektu UCD, poprzez szat graficzn, tre, optymalizacj, marketing, po programowanie i obsug serwerw. Wykonujemy take: - branding, - projekty opakowa, - sesje fotograficzne, - kampanie marketingowe, - narzdzia jzykowe i analityczne. Zapraszamy do zapoznania si z kilkoma przykadowymi projektami.

TAAT Technologie Cyfrowe

projekt i realizacja strony

wiktorczyk.com.pl
O projekcie
Strona spki rodzinnej, producenta wysokiej jakoci stolarki drewnianej.

wstp

Analiza potrzeb i bdw na podstawie statystyk z poprzedniej strony

Atrakcyjna szata graficzna Optymalizacja pod wzgldem konwersji

Cztery wersje jzykowe wsppraca: graficy nextday.pl

projekt i realizacja strony

wiktorczyk.com.pl
link home, wybr jzyka menu gwne i boczne (rozwijalne) menu okruszkowe (jeste tutaj) wszystkie zdjcia i grafiki opisane dymki po najechaniu wyszukiwarka nagwki h2-h6 nawigacja klawiatur punkty konwersji, USP tabele, listy wypunktowane i numerowane, paginatory stany linkw
OKNA DREWNIANE

architektura informacji

link

KATALOG WYPOSAENIE PODSTAWOWE DREWNO

hover active

OKUCIA OKIENNE SZYBY ZESPOLONE CIEPA RAMKA KLAMKI OKIENNE WYPOSAENIE DODATKOWE TECHNOLOGIE I CIEKAWOSTKI KOLORYSTYKA

projekt i realizacja strony

wiktorczyk.com.pl
Strona gwna Punkty startowe Zachcajce slajdy Powtarzane na podstronach:
- top (logo, slogan, menu gwne, wyszukiwarka) - stopka - widety spoecznociowe - gwny punkt konwersji (Kontakt) - zmiana jzyka

layout

projekt i realizacja strony

wiktorczyk.com.pl
Strona okna
Przejrzysty top oraz menu gwne wyranie oddzielone od reszty strony uatwia nawigacj.

podstrona gwnej kategorii

Intuicyjne menu boczne Punkty startowe do gwnych kategorii w formie wizualizacji i niebieskich linkw

Czytelne i atrakcyjne tabele

projekt i realizacja strony

wiktorczyk.com.pl
Strona realizacji
Slideshow ze zdjciami reazlizacji wykonany w javascript.

Prezentacja realizacji

Przegldanie bez przeadowania

strony

Podpisy pod zdjciami Paginator Nawigacja z klawiatury Miniaturki zdj powikszalne przy
klikniciu

projekt i realizacja strony

wiktorczyk.com.pl
Strona kontaktowa
Dane i adres firmy.

dane kontaktowe

Numery telefonw oraz e-mail

wywietlane po klikniciu dopiero kliknicie zliczane jest do statystyk konwersji.

projekt i realizacja strony

wiktorczyk.com.pl
Strona kontaktowa Mapka Google z adresem firmy Koordynaty GPS Wsprzdne w postaci kodu QR

layout

projekt i realizacja strony

wiktorczyk.com.pl
Strona drzwi wewntrznych Minimalna ilo treci Maksymalna liczba odsyaczy Wykorzystywana jako strona ldowania w kampanii AdWords

layout

Wspczynnik odrzuce 1% Punkty startowe do podstron

z wyposaeniem (zoom)

Menu boczne

projekt i realizacja strony

wiktorczyk.com.pl
Katalog produktw Menu boczne z list kategorii Linki zachcajce do kliknicia

layout

projekt i realizacja strony

wiktorczyk.com.pl
Podstrona z opisem Wielopoziomowe menu boczne Galerie w treci Na kocu treci kadej z podstron
znajduje si przycisk przenoszcy do powizanej z treci strony znajdujcej si bliej strony kontaktowej.
Zobacz ceny okien

layout

projekt i realizacja strony

wiktorczyk.com.pl
Podstrona cen okien Firma nie podaje dokadnych cen
okien na stronie (strategia firmy), mimo to:

layout

Zadaniem tej podstrony byo przycignicie uytkownikw szukajcych informacji o cenach i zachcenie do zapoznania si z ofert i kontaktu

Optymalizacja - testy A/B Wspczynnik odrzuce: przed optymalizacj 88%, 19% po optymalizacji.

projekt i realizacja strony

wiktorczyk.com.pl
Podstrona Zdjcie na kadej podstronie Wska, czytelna kolumna Wikszo podstron nie wymaga
przewijania

layout

Nagwki, tabele, listy wypunktowane i punkty konwersji

Krtkie treciwe informacje

projekt i realizacja strony

wiktorczyk.com.pl
Struktura dugiej podstrony
Rozwijalne menu boczne + tre podzielona na dwie kolumny o wysokiej czytelnoci

layout

Jzyk polski
Dzielenie wyrazw zgodne z polskimi zasadami pisowni, korekty typograficzne, wiszce spjniki.

Przyciski
Widet spoecznociowy przypity do prawej czci okna, przycisk owrotu do gry strony

projekt i realizacja strony

wiktorczyk.com.pl
Edycja podstrony Podgld treci na ywo Moliwo ukrycia podstrony
w danej wersji jzykowej

administracja strony

Narzdzia SEO

projekt i realizacja strony

wiktorczyk.com.pl
Panel administracyjny Opcje administratora dostpne po
zalogowaniu

administracja strony

Panel dopity do treci strony, menu

kontekstowe

Szybka edycja/usunicie aktywnej

strony

atwe dodawanie podstron Integracja z narzdziami Google

projekt i realizacja strony

wiktorczyk.com.pl
Caa tre strony jest rwnolegle prowadzona w wielu jzykach Interfejs strony moe by
tumaczony na kolejne jzyki

cztery wersje jzykowe

Wybrane podstrony mog by

ukrywane w danej wersji jzykowej

projekt i realizacja strony

wiktorczyk.com.pl
Tre strony jest prowadzona rwnolegle w wielu jzykach
Dotyczy to take: - opisw zdj, - komunikatw, - dymkw po najechaniu mysz - wersji jzykowych grafik - pokazw slajdw - moliwoci ukrycia niektrych treci

wersje jzykowe

projekt i realizacja strony

wiktorczyk.com.pl
Tre strony wzbogacona o trjwymiarowe wizualizacje Trjwymiarowe przekroje profili
jako punkty startowe

wizualizacje

Wizualizacje elementw oferty i wanych

detali

projekt i realizacja strony

wiktorczyk.com.pl
Infografiki wyposaenia Ilustracje przedstawiajce
zalety wyposaenia

infografiki

realizacja strony

asp.katowice.pl
O projekcie Serwis Akademii Sztuk Piknych w Katowicach.
Od pocztku konsultacji na etapie projektowym, poprzez wdroenie, dodawanie nowych funkcji serwis obsugujemy do dzi.

wstp

Projekt przy wsppracy pracownikw ASP Katowice, szata graficzna: Marta Wickowska

realizacja strony

asp.katowice.pl
Strona gwna Menu gwne, breadcrumbs, wyszukiwarka i menu boczne tworz prosty, spjny element nawigacyjny

layout

Newsy z moliwoci przyklejania Dodatkowe opcje dostpne dla zalogowanych

Dwie wersje jzkowe o rnej treci

realizacja strony

asp.katowice.pl
Menu kontekstowe Niektre opcje widoczne tylko dla
wybranych uzytkownikw (bezporednio w treci strony)

administracja

np. przyciski edytuj i opcja przyklejania newsw s widoczne jedynie dla redaktora newsw (oznaczone na zielono)

realizacja strony

asp.katowice.pl
Uprawnienia Zarzdzanie grupami uytkownikw
i uprawnieniami do poszczeglnych opcji

administracja

realizacja strony

asp.katowice.pl
Wirtualna galeria ASP Przegldanie prac bez przeadowania strony

layout

Paginator z podgldem miniatur Moliwo komentowania dziki

wtyczcze spoecznociowej

Gosowanie (antyspam, AJAX) Wdroenie jako nowa funkcja strony

(aktualizacja)

realizacja strony

asp.katowice.pl
Kalendarz Dwie opcje wywietlania: jako tabelaryczny kalendarz, lub jako lista nadchodzcych wydarze.

layout

Widet: Nie przegap

realizacja strony

asp.katowice.pl
Strona pedagodzy Zdjcie profilowe notka biograficzna Galeria prac Linki do dziau struktury w ASP w
ktrym naucza dany pedagog

layout

realizacja strony

asp.katowice.pl
Profile uytkownikw Zarzdzanie kontem Ostatnia aktywno Menu kontekstowe Unikatowe awatary

layout

realizacja strony

asp.katowice.pl
Kanay informacyjne Newsletter z kategoriami i liczne
kanay informacyjne pozwalaj na precyzyjne targetowanie

layout

Format Atom Format RSS Subskrybcja forum Newsletter z podziaem na kategorie

i wersjami jzykowymi

realizacja strony

asp.katowice.pl
Linki w menu gwnym
Wydarzenia Uczelnia Struktura Dyplomy link active visited hover

projekt stanw linkw

Linki w menu drugiego poziomu

Linki w treci
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptat...

link hover active visited

Kalendarz Galeria Wirtualna Wydawnictwa Informacje dla studentw

link hover

visited

Linki more
link hover Czytaj cao Czytaj cao

Nawigacja przy uyciu klawisza TAB

link focus active visited Kalendarz Galeria Wirtualna Wydawnictwa Informacje dla studentw

realizacja strony

asp.katowice.pl
Wykonalimy narzdzie do testowania stanw linkw. Jednoznacznie oznaczamy link w danym stanie (otwierany w nowym oknie, w innej wersji jzykowej, po najechaniu, przy nawigacji klawiatur, odwiedzony itp.) Jak wida, ilo kombinacji jest wyjtkowo dua. To narzdzie pozwala wyapa linki, ktrych stan nie jest jednoznacznie oznaczony.

projekt stanw linkw

projekt i realizacja strony

cms.taat.com.pl

wstp

Nasz autorski system zarzdzania treci.

Rozwizanie oferujce wszystkie wszystkie funkcje, potrzebne do osignicia komercyjnego sukcesu, w tym:

wsparcie etapu projektowego (UCD, dynamiczna mapa strony, testy jednostkowe, funkcjonalne)

prawidow obsug jzyka polskiego analityka i nacisk na konwersje atwo utrzymania i zmian wydajno

projekt i realizacja strony

cms.taat.com.pl
Jzyk polski, typografia z klas
Wyszukiwarka z obsug polskiej fleksji (stemmer), dzielenie wyrazw, usuwanie wiszcych spjnikw, wdw, poprawne cudzysowy, odmiana wyrazw itp.

atuty

atwo utrzymania rozbudowy

Proces realizacji projektu jest stosunkowo krtkim etapem w yciu strony www. Po jej uruchomieniu, zaczyna si dugi proces utrzymania witryny optymalizacji treci, wyapywania bdw, niedziaajcych linkw, naduy, aktualizacji, zmian funkcjonalnych i wdraanie kolejnych wersji. Zadbalimy o to, aby ten proces przebiega bezstresowo.

Kuloodporno
Bezpieczny kod zapewnia ochron przed wszystkimi prbami ingerencji zewntrznej. Testy jednostkowe i funkcjonalne gwarantuj poprawno dziaania po wszelkich zmianach i aktualizacjach. Kod strony jest zoptymalizowany ze wzgldu na wydajno i bezpieczestwo.

Nacisk na optymalizacj pod wyszukiwarki i marketing internetowy

Zintegrowalimy TAAT CMS z narzdziami potrzebnymi do skutecznej promocji w internecie: Wyszukiwarka Google, statystyki Google Analytics, Google Webmasters Tools, Allegro, Facebook i inne narzdzia spoecznociowe.

projekt i realizacja strony

cms.taat.com.pl
Wersje jzykowe
Caa te strony moe by rwnolegle prowadzona w wielu jzykach, interfejs strony moe by tumaczony na kolejne jzyki. Wybrane podstrony mog by ukrywane w danej wersji jzykowej.

atuty

Modularna budowa
Modularna budowa gwarantuje stopniowy etap wdraania projektu (maa strona moe zosta atwo przeksztacona w sklep internetowy lub portal informacyjny). Dziki temu koszty realizacji s optymalnie rozoone, czas uruchomienia dziaajcej wersji z podstawowymi funkcjami jest skrcony do minimum.

Szybko dziaania
Podstrony s generowane na podstawie informacji zgromadzonych w bazie danych. Istnieje moliwo wczenia mechanizmu cache, ktry pozwala na serwowanie stron w wersji statycznego HTML, co jest gwarancj najwikszej moliwej szybkoci dziaania.

projekt i realizacja strony

cms.taat.com.pl
Wersja na tablety i telefony, skrki
Tre jest w 100% rozdzielna od wygldu. Wygld strony mona w dowolnej chwili zmieni na inny, zaktualizowa do nowej szaty graficznej, przeczy do wersji dziaajcej inaczej w zalenoci od uytego urzdzenia.

atuty

projekt i realizacja strony

cms.taat.com.pl
Architektura infromacji

atuty

Zalety programistyczne najlepsze technologie (Zend Framework,

Doctrine ORM, jQuery, LessCSS)

menu gwne (w wersji drzewiastej lub rozwijalnej) menu powtrzone na dole strony menu funkcjonalne (menu pomocnicze) menu okruszkowe (jeste tutaj, cieka powrotu) wyszukiwarka z obsug polskiej fleksji mapa strony dla uytkownikw i dla robotw wyszukiwarek wersja do druku stany linkw nawigacja przy uyciu klawiatury widety funkcjonalne punkty USP (Unique Selling Point) formularze z przyjaznymi komunikatami bdw kanay informacyjne przyjazne komunikaty aplikacji paginatory sortowalne i przeszukiwalne tabele

dobrze dokumentowany kod testy jednostkowe testy funkcjonalne

projekt i realizacja strony

cms.taat.com.pl
Modu CMS

podstawowe moduy

Modu News
Podstrony informacyjne grupowane wg. kategorii, tworzone na tej samej zasadzie jak podstrony w module CMS. Kanay informacyjne. Moliwo wczenia opcji komentowania artykuw, antyspam.

Zarzdzanie podstronami i drzewiast map strony

(metod przecignij i upu)

Wgrywanie zdj i plikw (pojedynczo lub hurtowo),

automatyczne generowanie zadanych rozmiarw,

kadrowanie zdj, alternatywne opisy i podpisy pod

zdjciami, wyszukiwanie zdj wg. tagw.

Dodawanie treci za pomoc edytora WYSIWYG (jak

Word), w formacie Markdown lub HTML.

Tworzenie i edycja galerii zdj, pokazw slajdw,

wykorzystywanie ich na podstronach.

Tworzenie i edycja interaktywnych szablonw, do

pniejszego wykorzystania.

projekt i realizacja strony

cms.taat.com.pl
Modu User Zarzdzanie profilami uytkownikw,
przyznawanie praw dostpu do poszcze glnych zasobw witryny.

podstawowe moduy

Moliwo automatycznej rejestracji

za pomoc Facebooka, Gmaila lub innych serwisw wspierajcych OpenID.

Bezpieczne hasa, oryginay nie

przechowywane w bazie danych.

Tworzenie nowego konta

Aktywno uytkownikow

projekt i realizacja strony

cms.taat.com.pl
Modu Newsletter Wysyka newslettera na podstawie
newsw ze strony lub na podstawie zdefiniowanych szablonw.

podstawowe moduy

* Adres e-mail

Mailing spersonalizowany,
zoptymalizowany aby unikn spamu.
Aktualnoci Nowoci w katalogu

Zarzdzanie subskrybentami,
ogranizacja w grupy.

ledzenie stanu wysyki (wysana,

dorczona, przeczytana)

Zapisz si

ledzenie statusu konwersji.

projekt i realizacja strony

cms.taat.com.pl
Modu UCD
Modu User Centered Design jest uywany na etapie tworzenia projektu.

podstawowe moduy

Persony - tworzenie i edycja Scenariusze i przypadki uycia Integracja z testami funkcjonalnymi

Przykadowa personka w panelu administracyjnym

Przykadowe scenariusze

projekt i realizacja strony

cms.taat.com.pl
Modu Produkt
Rozbudowany, uniwersalny katalog produktw, ktry moe zosta poszerzony o funkcjonalno sklepu internetowego (koszyk, obsuga zamwie, stany magazynowe). Przykadowymi produktami mog by np. pliki, osoby, lekarze w przychodni, dowolne produkty w ofercie firm lub sklepw. Przykad uycia: strona www.komis-pszczyna.pl

podstawowe moduy

projekt i realizacja strony

cms.taat.com.pl
Modu Analytics
Zliczanie klikni w poszeglne elementy strony, statystyki uycia poszczeglnych linkw wywietlane na danej podstronie. Rozwizanie bardzo przydatne przy optymalizacji interfejsu uytkownika.

podstawowe moduy

Modu SEO
Sprawdzanie pozycji strony na wczeniej zdefiniowane sowa kluczowe.

Modu Calendar
Zarzdzanie kalendarzem i wydarzeniami.

Modu Backup
Zarzdzanie kopiami zapasowymi bazy danych.

Modu Analytics

projekt i realizacja strony

cms.taat.com.pl
Poprawna polszczyzna Wyszukiwarka z obsug polskiej
fleksji (stemmer)

typografia

PAN TADEUSZ
Litwo! Ojczyzno moja! ty jeste jak zdrowie. Ile ci trzeba ceni, ten tylko si dowie, Kto ci straci. Dzi pikno tw w caej ozdobie Widz i opisuj, bo tskni po tobie. inwokacja Rodutowskim Obuchowicz Piotrowski, Obolewski, Roycki, Janowicz, Mirzejewscy, Brochocki i konstytuowa. Ogosi nam, ach! tak mylili starzy. A zatem. tu zjedzie i pynnie mwi, i na folwarku nie wyszli wita, ale nie wierzono rzeczom najdawniejszym w sw kilka wyrzek, do Alpw podniebnych

Dzielenie wyrazw

dzie-le-nie

Usuwanie wiszcych spjnikw, wdw poprawne cudzysowy poprawne mylniki poprawne wielokropki kapitaliki odmiana wyrazw owijanie liczb i tagw w znacznik <span>,
ktry moe by dodatkowo ostylowany "" - ... TADEUSZ
TADEUSZ

CSS zosta opracowany przez organizacj W3C w 1996 r. Element SPAN jest uywany do wyrnienia tekstu.

projekt i realizacja strony

cms.taat.com.pl
Lista obrazkw Bezporednia edycja tagw alt oraz
title (AJAX inline)

panel administracyjny

Sortowanie, wyszukiwanie Podgld obrazka po najecheniu Ikonki z informacjami o dacie

utworzenia pliku oraz wgrania na serwer

Ikonki edycji, szczegw i usuwania

projekt i realizacja strony

cms.taat.com.pl
Tworzenie galerii zdjc po wgraniu plikw na serwer Masowe wgrywanie zdj Edycja tytuu i tekstu alternatywnego Opcja automatycznego tworzenia
galerii z wgranych zdj

panel administracyjny

projekt i realizacja strony

cms.taat.com.pl
Kadrowanie zdj

panel administracyjny

Grafiki s automatycznie skalowane do zadanych rozmiarw, w razie potrzeby przycinane. Kade zdjcie mona wykadrowa.

projekt i realizacja strony

cms.taat.com.pl
Formularz kontaktowy

formularze

Alert o bdzie

Alert o powodzeniu
wiadomo zostaa wysana

* Imi i nazwisko

* Imi i nazwisko

* Imi i nazwisko

* e-mail

* e-mail
Wypenienie tego pola jest obowizkowe, zawarto nie moe by pusta

* e-mail

Telefon Telefon * Tre wiadomoci * Tre wiadomoci

Telefon

* Tre wiadomoci

Wylij

Wylij

Wylij

Przycisk podczas wysyania wiadomoci

przycisk
Wylij

zablokowany - podczas wysyania

Wylij

projekt i realizacja strony

cms.taat.com.pl
Alerty aplikacji - komunikaty interakcji

formularze

projekt i realizacja strony

cms.taat.com.pl
Edytor struktury strony

architektura informacji

Struktura w 5 minut! Tre strony moe by edytowana metod przecignij i upu.

Mapa strony

Przeciganie podstron w inne miejsce w strukturze strony

Dodawanie podstron jednym klikniciem

Status oznaczony kolorami Kody kolorystyczne:

Strona niezmieniona Zmieniona pozycja Nowa strona

Ikonki usunicia/edycji podstrony

projekt i realizacja strony

cms.taat.com.pl
Strona bdu

obsuga bdw

Informacja o bdzie Szczegy bdu w logach dostpne

dla administratora

Sugestie rozwizania Wyszukiwarka Pozytywny komunikat i wizerunek

pieska osabia efekt zdenerwowania

projekt i realizacja strony

cms.taat.com.pl
Narzdzie do zgaszanie bdw

obsuga bdw

Wysyanie bdu bezporednio

z otwartej strony

Moliwo doczenia automatycznie wykonanego zrzutu ekranu

projekt modernizacji

kapias.pl
O projekcie
Nowa wersja strony producenta materiau szkkarskiego, imponujcych ogrodw do zwiedzania.

wstp

Projekt na podstawie poprzednich

statystyk, metod UCD

Nacisk na prostot interfejsu i potrzeby uytkownika

15 wersji layoutu projekt zakoczony, w trakcie wdroenia

projekt modernizacji

kapias.pl
Strona gwna Menu gwne Menu pomocnicze Ikony poszczeglnych dziaw Zajawki newsw i kategorie Pokaz slajdw Punkty startowe Funkcjonalna stopka

layout

projekt modernizacji

kapias.pl
Architektura informacji
menu gwne, boczne i powtrzone dziay wg. kolorw tematyka oznaczona ikonkami wyszukiwarka z polsk fleksj filtrowanie wg. kategorii menu okruszkowe funkcjonalne widety widety spoecznociowe galerie z opisami kategorie i tagi paginatory sugestie podobnych podstron drobne elementy nawigacyjne

architektura

projekt modernizacji

kapias.pl
Struktura strony Poszczeglne dziay s wyrnione
wasnym kolorem

layout

Duy stopie pisma uatwia czytanie

starszym osobom

projekt modernizacji

kapias.pl
Struktura strony Poszczeglne dziay s wyrnione
wasnym kolorem

layout

Kontekstowe widety zachcaj do

konwersji

projekt modernizacji

kapias.pl
Elementy interaktywne Interaktywna mapa przenosi do poszczeglnych czci Ogrodw do zwiedzania

layout

projekt modernizacji

kapias.pl
Prezentacja zdj Dynamiczne galerie zdj Funkcje spoecznociowe

layout

projekt modernizacji

kapias.pl
Skrcone galerie zdj Aby zaoszczdzi miejsce galerie s
skracane do minimum i rozwijane w razie potrzeby

layout

o nas

taat.pl
Dzikujemy za uwag. Zapraszamy do kontaktu i zadawania pyta! info@taat.pl +48 693 77 11 29 http://taat.pl

TAAT Technologie Cyfrowe