Komix » Co je nového » RefCar ŠKODA Auto: i v interních systémech chtějí lidé pracovat ve vyhovujícím UX a UI prostředí

RefCar ŠKODA Auto: i v interních systémech chtějí lidé pracovat ve vyhovujícím UX a UI prostředí

RefCar ŠKODA Auto: i v interních systémech chtějí lidé pracovat ve vyhovujícím UX a UI prostředí

Tisíce vozů ročně odebírají od ŠKODA Auto jednotlivá dealerství v rámci referentského programu. Jde o služební vozy zaměstnanců Škodovky, které po zajetí putují do distribuční sítě. Úlohou KOMIXu byl kompletní refaktoring aplikace. Změnili jsme však nejen kód, ale také UX a UI celého systému. 

Spousta interních aplikací se v různých firmách potýká s nevyhovujícím rozhraním. Systém sice funguje, ale uživatelské rozhraní není ani přívětivé, ani intuitivní. Grafika mnohdy připomíná dobu Windows 98 a bez manuálu o několika desítkách stran a pár hodin školení není možné se systémem pracovat.

S tím, jak každý z nás ovládá naprosto intuitivně aplikace v mobilech a tabletech, očekávají lidé to stejné také od interních firemních systémů. A tak jsme s vědomím tohoto očekávání přistoupili i k refaktoringu aplikace RefCar. Jen pro představu, ročně odebere 200 dealerství na 15 tisíc těchto referentských vozů.

 

Interní objednávkový systém a distribuce vozů dostal zcela jinou logiku. Zaměstnanci s ním pracují rychleji a snadněji

 

Jednotlivá dealerství mají stanovený počet vozů, které musí odebrat. Do systému se auta dostávají ve chvíli výroby, přičemž k dealerovi se dostanou zhruba za rok. Nicméně ten už ve chvíli výroby auto v interním systému RefCar objednává.

Při respektování korporátní identity a korporátního designu jsme změnili celou logiku aplikace. Původní systém každý požadavek zpracovával na samostatné podstránce, které však mezi sebou nebyly provázané. Pro uživatele to znamenalo mít po ruce tužku a papír a opisovat si případné specifikace vozů, které chtěli odebrat.

Existovaly samostatné seznamy vozů pro jednotlivé typy, podrobné informace o každém voze však bylo třeba vyhledat v dalším zcela odděleném seznamu a fotografie bylo třeba hledat také zvlášť.

Interní systém jako e-shop: stejný interface na všech stránkách

 

V celém systému se nyní uživatel orientuje podobně jako v běžném e-shopu: v seznamu vozů fungují filtry, u vybrané položky se zobrazí na jedné stránce fotogalerie i podrobný popis. A všechny požadavky zadává uživatel v jednotném interface.

Také jsme zjednodušili celé workflow, ve kterém dealeři vozy objednávají. Rozpracovali jsme je do funkčního UX a UI a výsledkem je, že i zaměstnanci jednotlivých dealerství s aplikací pracují raději. Je pro ně přehlednější a intuitivnější.

Původních 26 podstránek, na kterých uživatelé prováděli požadované akce, jsme nahradili jedinou stránkou. Zákazník také požadoval implementaci WLTP hodnot (spotřeba paliva dle nové metodiky). Analýza pro původní stránky opisovala nutnost změny na 23 místech v aplikaci. Díky našemu novému řešení stačilo udělat změnu na jediném místě.

Refaktoring aplikace pro KOMIX neznamená jen změnu kódu, ale i změnu technologie

 

Každý nový zaměstnanec zvládne aplikaci okamžitě používat, intuitivní UI je (nejen) v korporátu základem. Odpadají hodiny strávené na školení, roste produktivita práce. Celý vývoj probíhal agilně, dokumentace je srozumitelná.

Byznys chápe účel, vývojáři ví, co mají dělat. Navíc tento systém práce předchází vendor locku. A ještě jeden bonus navíc – díky srozumitelné dokumentaci mají i ostatní týmy potřebu a ochotu dokumentaci rozvíjet! A to je v korporátu, kde se potkávají různé týmy, věc vzácná.

Celou dokumentaci píšeme přímo ve ŠKODA Auto a je součástí Škoda wiki. Zákazníka (v tomto případě tým na straně Škodovky) vtahujeme do procesu vývoje od samého začátku. Nejde jen o transparentní přístup k zákazníkovi, zároveň se náš vývojový tým stává zákazníkovým partnerem. A to je největší bonus vzájemné spolupráce.

Technologie

 

V rámci projektu zavádíme nové technologie. Na backendu je Java se Springem, JPA a GraphQL rozhraní pro frontend. Frontend vyvíjíme v Reactu s využitím komponent PrimeReactu a píšeme v typescriptu. Používáme Bootstrap a styly jsou v SCSS.

Sdílet
Google, smaž mě!

Google, smaž mě!

Milujete data?

Milujete data?