Projekt koncepcyjny — nie realizacja kliencka
TRAKT — prototyp strony firmy transportowo-spedycyjnej
TRAKT to mój trzeci projekt koncepcyjny — szesnastostronicowa witryna firmy transportowo-spedycyjnej. Powstała po to, żeby sprawdzić, jak daleko da się zajść w branży TSL bez wtyczek: strona nie tylko opowiada o usługach, ale realnie liczy fracht, pokazuje status przesyłki i filtruje tabor.
Uwaga: TRAKT Sp. z o.o. nie jest istniejącą firmą. Nazwy, osoby, adresy, numery zleceń i stawki są fikcyjne, a formularze nie wysyłają wiadomości. Informuje o tym plakietka przypięta do każdej podstrony.
HTML
CSS
JavaScript
Netlify
Bez frameworków
Punkt wyjścia
Branża, w której strona zwykle kończy się na numerze telefonu
Strony firm transportowych są do siebie podobne: zdjęcie ciężarówki, trzy hasła o terminowości i formularz kontaktowy. Klient, który chce poznać orientacyjny koszt trasy albo sprawdzić, gdzie jest jego ładunek, i tak musi zadzwonić do spedytora. Chciałem sprawdzić, ile z tej pracy strona może wykonać sama.
Punktem wyjścia był projekt graficzny wygenerowany w Stitchu: jasna baza, złoty akcent, grafit, ostre krawędzie i wąska typografia. Strona główna odtwarza tę makietę sekcja po sekcji, a piętnaście pozostałych podstron rozwija ten sam język wizualny.
Prototyp ma odpowiedzieć na pytanie, którego makieta nie zadaje: co ta strona faktycznie robi, kiedy ktoś na nią kliknie.
Trzy rzeczy do rozwiązania
Zakres prac
Co zostało zrobione
Sześć elementów, które złożyły się na kompletną, gotową do wdrożenia witrynę.
Detal techniczny
Kalkulator, który liczy, a nie udaje
Odległość powstaje z współrzędnych obu miast liczonych po ortodromie i przemnożonych przez współczynnik trasy drogowej. Stawka bazowa zależy od rodzaju transportu — całopojazdowy, drobnica, chłodnia, ADR albo ponadgabaryt — a przy drobnicy dochodzi korekta za metry ładunkowe. Do frachtu doliczana jest procentowa dopłata paliwowa i opłaty drogowe rozbite na odcinek krajowy i zagraniczny.
Czas tranzytu wyprowadzony jest z dobowej normy czasu prowadzenia pojazdu, a wynik pokazuje rozbicie kosztów, parametry trasy i szacunkowy ślad węglowy. Trasa rysuje się na schemacie sieci połączeń, po którym jedzie ciężarówka. Cały model siedzi otwartym tekstem w jednym pliku, więc podmiana stawek na prawdziwe to kwestia kilku linijek.
Stawki w prototypie są przykładowe. Kalkulator jest punktem wyjścia do rozmowy, nie cennikiem — wiążącą ofertę zawsze wystawia spedytor.
Dlaczego tak, a nie inaczej
Co takie podejście daje firmie spedycyjnej
Stan na dziś
Efekt
Szesnaście podstron, pięć usług z siecią połączeń i przebiegiem zlecenia, tabor z filtrowaniem, kalkulator frachtu, śledzenie przesyłki, cztery artykuły, oferty pracy z formularzem rekrutacyjnym i mapa strony — wszystko w jednym arkuszu stylów i jednym skrypcie. Układ przełamuje się na trzech szerokościach, a typografia skaluje się między nimi płynnie.
Czysty HTML5
Autorski CSS
Vanilla JS
Zero zależności
Netlify
TRAKT jest projektem koncepcyjnym. Nazwa firmy, dane rejestrowe, oddziały, osoby, stawki i statusy przesyłek zostały wymyślone na potrzeby prezentacji, a strona jest wyłączona z indeksowania.
Prowadzisz firmę transportową i chcesz taką stronę?
To samo podejście — własny projekt zamiast szablonu, narzędzia zamiast samych deklaracji, lekki kod zamiast wtyczek — stosuję przy realizacjach komercyjnych. Opowiedz mi o swojej firmie podczas bezpłatnej konsultacji.