Projekt UX/UI

Technology Solutions 360

Odpowiedzialność: Tylko UX/UI Design

Projekt powstawał od podstaw i obejmował przygotowanie architektury informacji, sitemapy, ścieżek użytkowników oraz makiety UX/UI wraz z warstwą graficzną wzorcowych ekranów WEB i MOBILE.

Kluczowym wyzwaniem było stworzenie serwisu dla dwóch różnych grup odbiorców. Partnerzy technologiczni potrzebują szybkiego dostępu do produktów, specyfikacji oraz możliwości zgłoszenia projektu dla swojego klienta. Klienci końcowi szukają natomiast rozwiązania konkretnego problemu biznesowego lub technologicznego i nie muszą wiedzieć, jakiego produktu potrzebują.

Serwis został dlatego oparty na dwóch głównych filarach: Technology 360 — części produktowej i partnerskiej oraz Solutions 360 — części rozwiązaniowej przeznaczonej dla klientów końcowych.

Cel projektu

  • Zbudowanie nowoczesnej strony internetowej wspierającej rozwój nowej marki Technology Solutions 360.
  • Zwiększenie liczby leadów i skrócenie drogi użytkownika od potrzeby do kontaktu.
  • Czytelne rozdzielenie oferty produktowej od rozwiązań biznesowych.
  • Stworzenie serwisu obsługującego zarówno kanał partnerski, jak i klientów enterprise.
  • Pokazanie szerokiej oferty technologicznej bez przeciążania użytkownika informacjami.
  • Zbudowanie wizerunku firmy jako wiarygodnego, korporacyjnego i premium partnera IT.
  • Wyeksponowanie pozycji firmy jako kluczowego partnera Fsas Technologies i przedstawiciela marki na rynku polskim.
  • Pokazanie wsparcia na każdym etapie — od doboru technologii, przez wdrożenie, po dalszą obsługę.

Odbiorcy strony

  • Partnerzy technologiczni rozwijający ofertę dla swoich klientów.
  • Integratorzy systemów i firmy wdrożeniowe IT.
  • Firmy outsourcingowe i resellerzy technologii.
  • Handlowcy, inżynierowie oraz architekci poszukujący konkretnych produktów do realizowanych projektów.
  • Dyrektorzy i managerowie IT odpowiedzialni za infrastrukturę przedsiębiorstwa.
  • Duże firmy i organizacje enterprise szukające rozwiązania konkretnego problemu technologicznego.
  • Zakupowcy oraz zespoły techniczne analizujące dostępne technologie i możliwości wdrożenia.

Komunikacja musiała odpowiadać zarówno użytkownikowi, który zna produkt i potrzebuje jego specyfikacji lub wyceny, jak i osobie, która zna wyłącznie swój problem i oczekuje pomocy w dobraniu właściwego rozwiązania.

Wyzwanie projektowe

  • Oferta firmy obejmuje jednocześnie szeroki katalog produktów oraz kilkadziesiąt usług i rozwiązań technologicznych.
  • Partnerzy i klienci końcowi korzystają ze strony w zupełnie inny sposób.
  • Partner potrzebuje przede wszystkim katalogu, parametrów produktów, marek oraz możliwości zgłoszenia projektu.
  • Klient końcowy powinien poruszać się według logiki problem → rozwiązanie → kontakt.
  • Serwis musiał uporządkować rozbudowaną ofertę bez tworzenia skomplikowanej i przeciążonej nawigacji.
  • Kluczowe było ograniczenie liczby kliknięć i umożliwienie szybkiego przejścia do odpowiedniej kategorii lub formularza.
  • Nowa marka musiała od początku budzić zaufanie wymagających odbiorców B2B i enterprise.
  • Strona nie jest sklepem internetowym — jej głównym zadaniem jest prezentacja oferty i generowanie wartościowych zapytań.

Zakres prac UX/UI

  • Przygotowanie architektury informacji i sitemapy serwisu.
  • Zaprojektowanie głównej nawigacji z podziałem na Technology 360 i Solutions 360.
  • Zaprojektowanie strony głównej prezentującej działalność firmy, ofertę, przewagi i najważniejsze ścieżki użytkowników.
  • Opracowanie zbiorczej strony kategorii produktów.
  • Zaprojektowanie szablonu kategorii produktowej, np. serwerów.
  • Zaprojektowanie widoku pojedynczego produktu ze specyfikacją, cechami, korzyściami i grupami docelowymi.
  • Opracowanie strony zbiorczej rozwiązań.
  • Zaprojektowanie szablonu kategorii rozwiązania oraz pojedynczego rozwiązania.
  • Uwzględnienie obszarów takich jak Future Ready DC, Modernizacja, Managed Services, Multivendor Support oraz Solutions in The Box.
  • Zaprojektowanie podstrony O nas, Bloga, pojedynczego artykułu i Kontaktu.
  • Przygotowanie formularzy dopasowanych do różnych intencji użytkownika.
  • Zaprojektowanie ścieżki rejestracji projektu dla partnera.
  • Uwzględnienie formularza rejestracji partnera.
  • Przygotowanie sekcji case studies, certyfikatów, klientów i partnerstw technologicznych.
  • Zaprojektowanie elementów wspierających użytkownika, m.in. floatingowego asystenta kierującego do formularza kontaktowego.

Struktura oferty

Serwis został podzielony na dwa główne obszary:

Technology 360

Część skierowana przede wszystkim do partnerów technologicznych.

Obejmuje:

  • serwery,
  • storage,
  • sieć,
  • software,
  • marki technologiczne,
  • wsparcie,
  • rejestrację projektów.

Użytkownik może przejść od kategorii do konkretnego produktu, sprawdzić jego zastosowanie i parametry, a następnie zgłosić projekt dla swojego klienta.

Solutions 360

Część przeznaczona przede wszystkim dla klientów końcowych poszukujących odpowiedzi na konkretną potrzebę.

Główne obszary obejmują:

  • Future Ready DC,
  • Modernizację,
  • Managed Services,
  • Multivendor Support,
  • Solutions in The Box.

Solutions in The Box prezentuje gotowe rozwiązania możliwe do szybszego wdrożenia, m.in. miniDC in The Box, miniProtect in The Box, Backup in The Box, Private GPT in The Box, Monitoring in The Box oraz SIEM in The Box.

Formularze i generowanie leadów

Projekt zakłada różne scenariusze kontaktu zamiast jednego uniwersalnego formularza.

Użytkownik może wybrać m.in.:

  • Mam problem — dla klienta szukającego rozwiązania.
  • Zgłaszam projekt — dla partnera realizującego projekt dla swojego klienta.
  • Bezpłatna konsultacja — dla osoby, która nie wie jeszcze, jaki kierunek będzie odpowiedni.

Zakres formularza zmienia się zależnie od wybranej intencji użytkownika.

Po zgłoszeniu projektu partner może zostać dodatkowo zachęcony do rejestracji w programie partnerskim, co wspiera dalszy rozwój kanału partnerskiego.

Kluczowe założenia UX

  • Użytkownik powinien od początku rozumieć różnicę pomiędzy Produktami i Rozwiązaniami.
  • Partner powinien szybko dotrzeć do kategorii produktu, specyfikacji oraz rejestracji projektu.
  • Klient końcowy powinien móc rozpocząć ścieżkę od swojego problemu, bez konieczności znajomości konkretnej technologii.
  • Najważniejsze kategorie produktów i rozwiązań są dostępne bezpośrednio z nawigacji oraz strony głównej.
  • Na stronie zastosowano sekcje pokazujące najpopularniejsze produkty i rozwiązania, aby skrócić czas dotarcia do kluczowej oferty.
  • CTA są dostosowane do etapu ścieżki — na początku użytkownik poznaje ofertę, a dopiero głębiej przechodzi do kontaktu lub zgłoszenia projektu.
  • Serwis pokazuje wsparcie firmy przed wdrożeniem, podczas realizacji oraz po wdrożeniu.
  • Case studies mają prezentować konkretny schemat: klient → problem → zastosowany produkt lub rozwiązanie → efekt.
  • Blog został zaplanowany jako miejsce publikowania wiedzy eksperckiej, aktualności i insightów rynkowych.

Wizerunek i warstwa wizualna

Strona została zaprojektowana jako nowoczesny serwis technologiczny dla wymagającego odbiorcy B2B.

Główne założenia wizualne:

  • charakter premium i enterprise,
  • technologiczna, ale uporządkowana estetyka,
  • czytelna hierarchia informacji,
  • mocniejsze ciemne sekcje przeplatane jaśniejszymi obszarami,
  • wykorzystanie technologicznych fotografii infrastruktury, data center i środowisk enterprise,
  • wyraźne akcenty kolorystyczne przy CTA i kluczowych elementach interfejsu,
  • unikanie zbyt ciężkiej, gamingowej lub przesadnie futurystycznej stylistyki.

Projekt wizualny został oparty na preferencjach klienta zebranych podczas pracy z moodboardami — ważne były przede wszystkim przejrzystość informacji, nowoczesność, dobry balans kolorystyczny i brak nadmiernie ciemnej estetyki.

Wiarygodność i przewagi marki

W projekcie przewidziano wiele elementów budujących zaufanie:

  • komunikację pozycji Technology Solutions 360 jako ważnego partnera Fsas Technologies,
  • prezentację najważniejszych partnerstw technologicznych,
  • certyfikaty,
  • logotypy prestiżowych klientów,
  • sekcję „O nas w liczbach”,
  • case studies,
  • prezentację wsparcia na każdym etapie współpracy,
  • komunikację doświadczenia i standardu działania oczekiwanego przez klientów enterprise.

Ważnym elementem wizerunkowym jest również wykorzystanie Dariusza Kwiecińskiego jako osoby wzmacniającej wiarygodność marki — m.in. poprzez sekcję z rekomendacją i komunikacją doświadczenia stojącego za nowym przedsięwzięciem.

Efekty prac UX/UI

  • Powstała uporządkowana architektura informacji dla rozbudowanej oferty produktowej i rozwiązaniowej.
  • Wyraźnie rozdzielono ścieżkę partnera technologicznego od ścieżki klienta końcowego.
  • Produkty zostały uporządkowane według kategorii, marek oraz zastosowań.
  • Rozwiązania zostały przedstawione w języku potrzeb i korzyści biznesowych zamiast wyłącznie parametrów technicznych.
  • Zaprojektowano różne punkty wejścia do kontaktu zależnie od intencji użytkownika.
  • Partner może szybko przejść od produktu do zgłoszenia projektu dla swojego klienta.
  • Klient końcowy może przejść od problemu do konkretnej kategorii rozwiązania i konsultacji.
  • Projekt mocno eksponuje wsparcie przed, podczas i po wdrożeniu jako jeden z głównych wyróżników firmy.
  • Serwis został przygotowany tak, aby w przyszłości można było rozwijać katalog produktów, rozwiązania, case studies, blog oraz strefę partnerską.
  • Warstwa graficzna wzmacnia pozycjonowanie Technology Solutions 360 jako nowoczesnego, profesjonalnego partnera dla rynku B2B i enterprise.

Podsumowanie

Projekt Technology Solutions 360 pokazuje, jak rozbudowaną ofertę technologiczną można uporządkować wokół rzeczywistych sposobów korzystania z niej przez użytkowników.

Najważniejszym założeniem było rozdzielenie dwóch zupełnie różnych potrzeb: partnera szukającego konkretnego produktu dla swojego klienta oraz organizacji, która zna swój problem, ale potrzebuje pomocy w znalezieniu właściwego rozwiązania.

Dzięki podziałowi na Technology 360 i Solutions 360, rozbudowanej nawigacji, kontekstowym formularzom oraz mocnej ekspozycji wsparcia projekt prowadzi użytkownika od pierwszej potrzeby do produktu, rozwiązania lub kontaktu bez konieczności przedzierania się przez techniczny katalog.

Całość została zaprojektowana jako korporacyjny, premium serwis B2B, który jednocześnie prezentuje technologię, buduje zaufanie do nowej marki i wspiera generowanie wartościowych leadów.

Interaktywny prototyp

Powiększ ekran i przejdź przez interaktywny prototyp (przeklikaj i przescrolluj). Dostępna jest także wersja na inne rozdzielczości.

No items found.
Makiety UX/UI

Zobacz pozostałe Makiety UX/UI dla Aplikacji i Stron internetowych

Zobacz przykłady makiet UX i UI przygotowanych w procesie projektowania stron internetowych i aplikacji mobilnych. Każda makieta UX to podstawa intuicyjnego interfejsu i lepszego doświadczenia użytkownika.

Więcej projektów
Projektowanie UX/UI

Kluczowe usługi UX/UI dla firm

Makiety UX/UI stron internetowych, sklepów i aplikacji oraz audyty użyteczności.

Makiety UX/UI stron internetowych

Projektuję makiety UX/UI stron internetowych i landing page’y dopasowane do celów biznesowych i potrzeb użytkowników. Tworzę intuicyjne interfejsy wspierające konwersję i przygotowane do sprawnego wdrożenia.

Makiety Stron

Makiety UX/UI Aplikacji

Projektuję makiety aplikacji mobilnych, webowych, SaaS i dedykowanych systemów. Dbam o użyteczność, intuicyjne ścieżki użytkownika i przygotowanie projektu UX/UI do sprawnego wdrożenia.

Makiety Aplikacji

Makiety UX/UI sklepów internetowych

Projektuję makiety UX/UI sklepów internetowych z naciskiem na intuicyjną nawigację, prezentację produktów i skuteczną ścieżkę zakupową. Projekt przygotowuję w Figma, gotowy do późniejszego wdrożenia.

Makiety Sklepów

Potrzebujesz indywidualnej wyceny projektu UX/UI lub grafiki?

Wypełnij krótki formularz — na jego podstawie przygotuję rekomendację i wycenę dopasowaną do celu projektu (UX/UI, audyt, grafika).

Masz pytanie?

Ten formularz służy wyłącznie do krótkich zapytań organizacyjnych lub technicznych. Wyceny projektów realizuję tylko przez formularz zgłoszenia projektu UX/UI lub Grafiki.

Dzięki za wiadomość!
Odniosę się w przeciągu najbliższej doby :)

Piotrek Trzaskowski UX-MAN
Coś poszło nie tak. Spróbuj wysłać wiadomość jeszcze raz.