Case study · Website redesign · Logistics · Web

Vireo Logistics.

Open the prototype open_in_new

A second look at a car-transport website I designed before — same brand and pages, rebuilt around a quote.

local_shippingClient
International car transport
personRole
UX/UI designer, both versions
sync_altType
Redesign of my own earlier design
devicesPlatform
Website, desktop and mobile
New Vireo Logistics homepage: headline, truck photo and a quick quote bar
The new homepage on a phone
01Starting point

My first version introduced the company, but did not start a conversation.

The client moves cars across Scandinavia and Europe. My first version had the right pages, but a visitor could only press "Susisiekime" — get in touch. I went through it as a customer and noted where it made them work.

My first versionMy first version of the homepage: dark photo with an all-caps headline, icon tiles, map, client logos, certificates, a short form
  1. One vague actionEvery button says "get in touch". There is no way to say what, from where and to where.
  2. Headlines in capitalsAll titles are uppercase, so long Lithuanian words become hard to scan.
  3. Services without wordsSix icon tiles with a name each — no sentence telling what the customer gets.
  4. Proof hidden deep12 years, 485 000+ transports and 40 clients sit deep inside "About us".
  5. A photo strip on every pageThe same dark header photo pushes the content of each inner page down.
  6. A map of the wrong cityThe contact page shows a placeholder map, not the Vilnius office.
02Goal & approach
Keep the brand. Change the question from "who are we?" to "what do you need moved?"
1Same pages, same contentHome, Services, About us, Careers and Contacts stay. Nothing the company says about itself is thrown away.
2A look at the neighboursFour car-logistics sites: a quote button, numbers, a route map and order steps on nearly all.
3A quote from the first screenFrom, to, how many cars — three answers the company needs anyway.
4Explain the offer, not only name itA sentence under every service, and a picture for the full and the partial load.
5Answer the questions before the callPrice, insurance, documents and tracking — answered on the page, right next to the quote form.
03Structure

Five pages, as before. What is on them changed.

The menu keeps its four links and gains two things that are always visible: the phone number and "Gauti pasiūlymą" — get a quote. Parts marked in bold are new.

Home
  • Quick quote bar
  • Numbers under the hero
  • Services
  • How an order goes
  • Routes map
  • Clients, certificates
  • Questions & answers
  • Full quote form
Services
  • Three promises
  • Full and partial load, drawn
  • Four more services
  • Four steps
  • Questions & answers
About us
  • Photo and numbers
  • The company's story
  • What they invest in
  • Routes map
  • Clients, certificates
Careers
  • What the company offers
  • Open positions
  • "Apply" fills in the position
  • Application form with CV
Contacts
  • Phone, e-mail, office
  • Company details
  • Quote form with route and cars
  • Map of the Vilnius office
04Key design decisions

What I changed, and why.

Five decisions — each next to the piece of my first version it replaces.

01

The quote starts on the first screen

One bar under the headline: from, to, how many cars. It opens the full form with the answers already filled in.

Why"Get in touch" asks the visitor to write a letter. Three small fields ask for what they already know — and give the company a request it can price.

New hero: headline 'Pervežame automobilius visoje Europoje. Laiku ir saugiai.', the truck photo, and the quick quote bar
Old hero: an all-caps headline over a dark photo and one buttonFirst versionA centred all-caps headline over the photo and a single "Susisiekime!" button.
02

Full or partial load — shown, not explained

One drawing of a carrier with eleven places: full for a full load, three for a partial one. In the form it fills up with the number of cars.

Why"Up to 11 vehicles" is a number; a carrier with free places is an answer. The customer sees which offer is theirs before reading a line.

Service cards: a full load with eleven cars on the carrier and a partial load with three; four smaller service cards with a sentence each
Old offer cards with two small truck iconsFirst versionTwo small icons on a blue band, deep on the Services page.
03

A form that helps while you fill it in

Labels above the fields, car types as chips, errors named next to the field. After sending — a clear "thank you".

WhyMy first form had three underlined fields and placeholder text as labels. A request for transport needs a route and a number of cars to be answered at all.

Quote form: route, number of cars with the carrier filling up, car type chips, contact fields, inline error messages
  1. Six cars chosen: six places on the carrier turn blue, and the form says "partial load".
  2. Errors sit under the field they belong to.
  3. One primary button; consent is asked once, in plain words.
04

Proof moves up

Years, transports, clients and team sit right under the hero, with logos and certificates further down.

WhyA company with 485 000 transports behind it should not keep that deep inside "About us".

Numbers band: 12+ years, 485 000+ transports, 40+ clients, 60+ team members How we work: four numbered steps from request to delivery
05

A map that answers "do you go there?"

Routes from Vilnius on two tabs — Scandinavia and the rest of Europe — with the countries listed beside them.

Why"Skandinavijoje" and "Visoje Europoje" are the company's own two words for where it works. The map keeps them and makes them concrete.

Routes section: a dotted map of Europe with lines from Vilnius to Sweden, Norway, Finland and Denmark; tabs Skandinavija and Visa Europa
05Before & after

The same homepage, side by side.

Same logo, same colours, same photo. Hover either page to scroll through it.

First versionMy first version of the homepage
RedesignNew homepage
06The pages

Five pages, built as a working prototype.

The redesign is not a set of pictures: the menu, the forms, the map tabs and the car counter all work. Hover a page to scroll, click to open it full size.

Home
HomeQuote bar, numbers, services, routes, form
Services
ServicesFull and partial load, four steps, FAQ
About us
About usStory, numbers, routes, certificates
Careers
CareersOpen positions and the application form
Contacts
ContactsContacts, quote form, office map
ads_clickLive prototype Click through the new website yourself.

All five pages open in a new tab. Fill in the quote bar, change the number of cars, switch the map.

Open the prototype open_in_new
vireo-logistics / index.htmlThe new Vireo Logistics homepage
Home on a phone
Home
Menu on a phone
Menu
Services on a phone
Services
Contacts and the quote form on a phone
Quote form
07Visual design

The brand stays. The voice gets calmer.

Cyan and navy come from the logo, and its diamond marks bullets and steps. Headlines drop the capitals; the photo is graded darker to fit the navy.

Navy#05232ETop sections, footer, text
Deep navy#03171FHero background
Cyan#03A2D9Actions and accents
Light cyan#8FD9F2Labels on dark
Mist#F3F6F8Cards and light sections
Next case study

Fumora Asia.

→