Finanční kalkulačky ČSOB

Ekosystém webových bankovních kalkulaček a porovnávačů

  • finance

  • Bankovnictví

  • UX

  • UI

  • Hlavním úkolem projektu bylo sjednocení ekosystému webových bankovních kalkulaček na webu csob.cz a zároveň návrh porovnávačů finančních produktů v rámci digitálních služeb banky.
  • Projekt zahrnoval návrh několika nástrojů, které slouží jako vstupní bod pro rozhodování klientů v oblasti financí. Součástí řešení byl centrální rozcestník finančních kalkulaček a jednotlivé specializované nástroje, mimo jiné:
  • kalkulačky půjček a financování bydlení,
  • nástroj pro konsolidaci půjček,
  • krokový nástroj pro refinancování,
  • porovnávače spořicích a investičních produktů.
  • Cílem nebylo vytvářet izolované aplikace, ale ucelený a konzistentní systém, který umožňuje:
  • snadnou orientaci v nabídce finančních produktů,
  • přímé porovnání variant,
  • plynulý přechod k dalším krokům v rámci online bankovních služeb.

Přístupnost a rozsah

Projekt vznikal v prostředí velké bankovní instituce s vysokými nároky na stabilitu, bezpečnost a konzistenci digitálních služeb.

Návrh musel respektovat existující design systém banky, interní standardy i regulatorní omezení typická pro finanční sektor.

Řešení bylo od začátku navrhováno s důrazem na přístupnost a použitelnost napříč širokým spektrem uživatelů, nikoli jako dodatečná úprava.

Součástí návrhu bylo zejména:

  • dodržení pravidel WCAG,
  • dostatečné kontrasty a čitelnost rozhraní,
  • ovladatelnost pomocí klávesnice i dotykových zařízení,
  • plnohodnotné fungování na mobilních zařízeních.

Cílem nebylo navrhnout jednotlivé nástroje izolovaně, ale vytvořit dlouhodobě rozšiřitelný a konzistentní systém, který zapadá do celého digitálního ekosystému banky a obstojí i při dalším rozvoji služeb.

Rozcestník jako vstupní bod

Byl navržen centrální rozcestník finančních kalkulaček, který slouží jako hlavní vstupní bod do celého ekosystému. Jeho cílem bylo zjednodušit orientaci v nabídce nástrojů a umožnit uživateli rychlý přechod ke konkrétnímu výpočtu bez nutnosti zbytečného hledání.

Rozcestník:

  • zjednodušuje orientaci v široké nabídce finančních nástrojů,
  • umožňuje okamžitý vstup do relevantního výpočtu,
  • funguje jako přirozený konverzní bod v rámci digitálních služeb banky.

Nejde pouze o navigační prvek - rozcestník je součástí rozhodovacího procesu, který uživatele provází od prvotní orientace až k dalším krokům.

Porovnání produktů jako základní UX pattern

Klíčovým principem návrhu bylo přímé porovnání finančních produktů a jejich variant. Rozhraní bylo navrženo tak, aby uživatel mohl sledovat rozdíly v klíčových parametrech - jako je výše splátky, úroková sazba nebo celková úspora - pod sebou, v jednom kontextu.

Horizontální rozvržení:

  • odpovídá přirozenému způsobu rozhodování založenému na porovnávání,
  • snižuje kognitivní zátěž tím, že eliminuje nutnost přepínání mezi variantami,
  • urychluje orientaci v datech a podporuje informované rozhodnutí,
  • dodržuje poměr stran desktopových zařízení.

Porovnání zde neslouží pouze jako vizuální prvek, ale jako základní rozhodovací mechanismus celého systému.

Výsledek

Navržený ekosystém nebyl jednorázovým řešením, ale soustavou vzájemně provázaných nástrojů, které sdílejí společné principy, komponenty a chování.

Součástí ekosystému byly mimo jiné:

  • Půjčka na bydlení

Online kalkulačka s orientačním výpočtem v reálném čase a jasným oddělením informativní a závazné fáze rozhodování.

  • Konsolidace půjček

Nástroj pro sloučení stávajících půjček s přehledným zobrazením úspory, změny měsíční splátky a dopadu na rodinný rozpočet.

  • Refinancování

Krokový průvodce porovnávající nejčastější scénáře refinancování bez nutnosti složité orientace v produktech.

  • Rekonstrukce bydlení

Kalkulačka pro plánování financování rekonstrukce s návazností na doporučené produkty banky.

  • Porovnávače spořicích produktů

Nástroje pro srovnání spoření a investic na základě jednoduchého zadání.

Každý nástroj funguje samostatně, ale zároveň zapadá do jednotného systému, což uživatelům zajišťuje konzistentní zkušenost napříč digitálními službami banky.

Dopad a přínos

Navržený ekosystém přinesl přínosy jak pro uživatele, tak pro banku:

  • Snížení kognitivní zátěže

Komplexní finanční rozhodování bylo převedeno do srozumitelného a strukturovaného procesu.

  • Vyšší sebeobslužnost uživatelů

Klienti jsou schopni samostatně porozumět produktům a porovnat varianty bez nutnosti okamžité konzultace.

  • Přirozená podpora konverze

Kalkulačky fungují jako vstupní bod k dalším krokům bez nátlaku na předčasné rozhodnutí.

  • Škálovatelný základ pro další rozvoj

Modulární architektura umožňuje rozšiřování ekosystému o další produkty bez narušení celku.

  • Posílení důvěry v digitální nástroje banky

Konzistentní chování, přístupnost a respekt k bankovní identitě podporují vnímání stability a profesionality.

Shrnutí projektu

Tento projekt ukazuje, že i vysoce komplexní a regulované finanční služby lze navrhnout jako přehledný, přístupný a dlouhodobě udržitelný digitální systém, který podporuje jak potřeby uživatelů, tak obchodní cíle organizace.

© 2026 Michal Kuranda — UX/UI Designer Navrhuji digitální produkty, které dávají smysl lidem i byznysu.

Finanční kalkulačky ČSOB

Ekosystém webových bankovních kalkulaček a porovnávačů

  • finance

  • Bankovnictví

  • UX

  • UI

  • Hlavním úkolem projektu bylo sjednocení ekosystému webových bankovních kalkulaček na webu csob.cz a zároveň návrh porovnávačů finančních produktů v rámci digitálních služeb banky.
  • Projekt zahrnoval návrh několika nástrojů, které slouží jako vstupní bod pro rozhodování klientů v oblasti financí. Součástí řešení byl centrální rozcestník finančních kalkulaček a jednotlivé specializované nástroje, mimo jiné:
  • kalkulačky půjček a financování bydlení,
  • nástroj pro konsolidaci půjček,
  • krokový nástroj pro refinancování,
  • porovnávače spořicích a investičních produktů.
  • Cílem nebylo vytvářet izolované aplikace, ale ucelený a konzistentní systém, který umožňuje:
  • snadnou orientaci v nabídce finančních produktů,
  • přímé porovnání variant,
  • plynulý přechod k dalším krokům v rámci online bankovních služeb.

Přístupnost a rozsah

Projekt vznikal v prostředí velké bankovní instituce s vysokými nároky na stabilitu, bezpečnost a konzistenci digitálních služeb.

Návrh musel respektovat existující design systém banky, interní standardy i regulatorní omezení typická pro finanční sektor.

Řešení bylo od začátku navrhováno s důrazem na přístupnost a použitelnost napříč širokým spektrem uživatelů, nikoli jako dodatečná úprava.

Součástí návrhu bylo zejména:

  • dodržení pravidel WCAG,
  • dostatečné kontrasty a čitelnost rozhraní,
  • ovladatelnost pomocí klávesnice i dotykových zařízení,
  • plnohodnotné fungování na mobilních zařízeních.

Cílem nebylo navrhnout jednotlivé nástroje izolovaně, ale vytvořit dlouhodobě rozšiřitelný a konzistentní systém, který zapadá do celého digitálního ekosystému banky a obstojí i při dalším rozvoji služeb.

Rozcestník jako vstupní bod

Byl navržen centrální rozcestník finančních kalkulaček, který slouží jako hlavní vstupní bod do celého ekosystému. Jeho cílem bylo zjednodušit orientaci v nabídce nástrojů a umožnit uživateli rychlý přechod ke konkrétnímu výpočtu bez nutnosti zbytečného hledání.

Rozcestník:

  • zjednodušuje orientaci v široké nabídce finančních nástrojů,
  • umožňuje okamžitý vstup do relevantního výpočtu,
  • funguje jako přirozený konverzní bod v rámci digitálních služeb banky.

Nejde pouze o navigační prvek - rozcestník je součástí rozhodovacího procesu, který uživatele provází od prvotní orientace až k dalším krokům.

Porovnání produktů jako základní UX pattern

Klíčovým principem návrhu bylo přímé porovnání finančních produktů a jejich variant. Rozhraní bylo navrženo tak, aby uživatel mohl sledovat rozdíly v klíčových parametrech - jako je výše splátky, úroková sazba nebo celková úspora - pod sebou, v jednom kontextu.

Horizontální rozvržení:

  • odpovídá přirozenému způsobu rozhodování založenému na porovnávání,
  • snižuje kognitivní zátěž tím, že eliminuje nutnost přepínání mezi variantami,
  • urychluje orientaci v datech a podporuje informované rozhodnutí,
  • dodržuje poměr stran desktopových zařízení.

Porovnání zde neslouží pouze jako vizuální prvek, ale jako základní rozhodovací mechanismus celého systému.

Výsledek

Navržený ekosystém nebyl jednorázovým řešením, ale soustavou vzájemně provázaných nástrojů, které sdílejí společné principy, komponenty a chování.

Součástí ekosystému byly mimo jiné:

  • Půjčka na bydlení

Online kalkulačka s orientačním výpočtem v reálném čase a jasným oddělením informativní a závazné fáze rozhodování.

  • Konsolidace půjček

Nástroj pro sloučení stávajících půjček s přehledným zobrazením úspory, změny měsíční splátky a dopadu na rodinný rozpočet.

  • Refinancování

Krokový průvodce porovnávající nejčastější scénáře refinancování bez nutnosti složité orientace v produktech.

  • Rekonstrukce bydlení

Kalkulačka pro plánování financování rekonstrukce s návazností na doporučené produkty banky.

  • Porovnávače spořicích produktů

Nástroje pro srovnání spoření a investic na základě jednoduchého zadání.

Každý nástroj funguje samostatně, ale zároveň zapadá do jednotného systému, což uživatelům zajišťuje konzistentní zkušenost napříč digitálními službami banky.

Dopad a přínos

Navržený ekosystém přinesl přínosy jak pro uživatele, tak pro banku:

  • Snížení kognitivní zátěže

Komplexní finanční rozhodování bylo převedeno do srozumitelného a strukturovaného procesu.

  • Vyšší sebeobslužnost uživatelů

Klienti jsou schopni samostatně porozumět produktům a porovnat varianty bez nutnosti okamžité konzultace.

  • Přirozená podpora konverze

Kalkulačky fungují jako vstupní bod k dalším krokům bez nátlaku na předčasné rozhodnutí.

  • Škálovatelný základ pro další rozvoj

Modulární architektura umožňuje rozšiřování ekosystému o další produkty bez narušení celku.

  • Posílení důvěry v digitální nástroje banky

Konzistentní chování, přístupnost a respekt k bankovní identitě podporují vnímání stability a profesionality.

Shrnutí projektu

Tento projekt ukazuje, že i vysoce komplexní a regulované finanční služby lze navrhnout jako přehledný, přístupný a dlouhodobě udržitelný digitální systém, který podporuje jak potřeby uživatelů, tak obchodní cíle organizace.

© 2026 Michal Kuranda — UX/UI Designer Navrhuji digitální produkty, které dávají smysl lidem i byznysu.

Finanční kalkulačky ČSOB

Ekosystém webových bankovních kalkulaček a porovnávačů

  • finance

  • Bankovnictví

  • UX

  • UI

Hlavním úkolem projektu bylo sjednocení ekosystému webových bankovních kalkulaček na webu csob.cz a zároveň návrh porovnávačů finančních produktů v rámci digitálních služeb banky.

Projekt zahrnoval návrh několika nástrojů, které slouží jako vstupní bod pro rozhodování klientů v oblasti financí. Součástí řešení byl centrální rozcestník finančních kalkulaček a jednotlivé specializované nástroje, mimo jiné:

  • kalkulačky půjček a financování bydlení,
  • nástroj pro konsolidaci půjček,
  • krokový nástroj pro refinancování,
  • porovnávače spořicích a investičních produktů.

Cílem nebylo vytvářet izolované aplikace, ale ucelený a konzistentní systém, který umožňuje:

  • snadnou orientaci v nabídce finančních produktů,
  • přímé porovnání variant,
  • plynulý přechod k dalším krokům v rámci online bankovních služeb.

Přístupnost a rozsah

Projekt vznikal v prostředí velké bankovní instituce s vysokými nároky na stabilitu, bezpečnost a konzistenci digitálních služeb.

Návrh musel respektovat existující design systém banky, interní standardy i regulatorní omezení typická pro finanční sektor.

Řešení bylo od začátku navrhováno s důrazem na přístupnost a použitelnost napříč širokým spektrem uživatelů, nikoli jako dodatečná úprava.

Součástí návrhu bylo zejména:

  • dodržení pravidel WCAG,
  • dostatečné kontrasty a čitelnost rozhraní,
  • ovladatelnost pomocí klávesnice i dotykových zařízení,
  • plnohodnotné fungování na mobilních zařízeních.

Cílem nebylo navrhnout jednotlivé nástroje izolovaně, ale vytvořit dlouhodobě rozšiřitelný a konzistentní systém, který zapadá do celého digitálního ekosystému banky a obstojí i při dalším rozvoji služeb.

Rozcestník jako vstupní bod

Byl navržen centrální rozcestník finančních kalkulaček, který slouží jako hlavní vstupní bod do celého ekosystému. Jeho cílem bylo zjednodušit orientaci v nabídce nástrojů a umožnit uživateli rychlý přechod ke konkrétnímu výpočtu bez nutnosti zbytečného hledání.

Rozcestník:

  • zjednodušuje orientaci v široké nabídce finančních nástrojů,
  • umožňuje okamžitý vstup do relevantního výpočtu,
  • funguje jako přirozený konverzní bod v rámci digitálních služeb banky.

Nejde pouze o navigační prvek - rozcestník je součástí rozhodovacího procesu, který uživatele provází od prvotní orientace až k dalším krokům.

Porovnání produktů jako základní UX pattern

Klíčovým principem návrhu bylo přímé porovnání finančních produktů a jejich variant. Rozhraní bylo navrženo tak, aby uživatel mohl sledovat rozdíly v klíčových parametrech - jako je výše splátky, úroková sazba nebo celková úspora - pod sebou, v jednom kontextu.

Horizontální rozvržení:

  • odpovídá přirozenému způsobu rozhodování založenému na porovnávání,
  • snižuje kognitivní zátěž tím, že eliminuje nutnost přepínání mezi variantami,
  • urychluje orientaci v datech a podporuje informované rozhodnutí,
  • dodržuje poměr stran desktopových zařízení.

Porovnání zde neslouží pouze jako vizuální prvek, ale jako základní rozhodovací mechanismus celého systému.

Výsledek

Navržený ekosystém nebyl jednorázovým řešením, ale soustavou vzájemně provázaných nástrojů, které sdílejí společné principy, komponenty a chování.

Součástí ekosystému byly mimo jiné:

  • Půjčka na bydlení

Online kalkulačka s orientačním výpočtem v reálném čase a jasným oddělením informativní a závazné fáze rozhodování.

  • Konsolidace půjček

Nástroj pro sloučení stávajících půjček s přehledným zobrazením úspory, změny měsíční splátky a dopadu na rodinný rozpočet.

  • Refinancování

Krokový průvodce porovnávající nejčastější scénáře refinancování bez nutnosti složité orientace v produktech.

  • Rekonstrukce bydlení

Kalkulačka pro plánování financování rekonstrukce s návazností na doporučené produkty banky.

  • Porovnávače spořicích produktů

Nástroje pro srovnání spoření a investic na základě jednoduchého zadání.

Každý nástroj funguje samostatně, ale zároveň zapadá do jednotného systému, což uživatelům zajišťuje konzistentní zkušenost napříč digitálními službami banky.

Dopad a přínos

Navržený ekosystém přinesl přínosy jak pro uživatele, tak pro banku:

  • Snížení kognitivní zátěže

Komplexní finanční rozhodování bylo převedeno do srozumitelného a strukturovaného procesu.

  • Vyšší sebeobslužnost uživatelů

Klienti jsou schopni samostatně porozumět produktům a porovnat varianty bez nutnosti okamžité konzultace.

  • Přirozená podpora konverze

Kalkulačky fungují jako vstupní bod k dalším krokům bez nátlaku na předčasné rozhodnutí.

  • Škálovatelný základ pro další rozvoj

Modulární architektura umožňuje rozšiřování ekosystému o další produkty bez narušení celku.

  • Posílení důvěry v digitální nástroje banky

Konzistentní chování, přístupnost a respekt k bankovní identitě podporují vnímání stability a profesionality.

Shrnutí projektu

Tento projekt ukazuje, že i vysoce komplexní a regulované finanční služby lze navrhnout jako přehledný, přístupný a dlouhodobě udržitelný digitální systém, který podporuje jak potřeby uživatelů, tak obchodní cíle organizace.

© 2026 Michal Kuranda — UX/UI Designer Navrhuji digitální produkty, které dávají smysl lidem i byznysu.

Finanční kalkulačky ČSOB

Ekosystém webových bankovních kalkulaček a porovnávačů

  • finance

  • Bankovnictví

  • UX

  • UI

  • Hlavním úkolem projektu bylo sjednocení ekosystému webových bankovních kalkulaček na webu csob.cz a zároveň návrh porovnávačů finančních produktů v rámci digitálních služeb banky.
  • Projekt zahrnoval návrh několika nástrojů, které slouží jako vstupní bod pro rozhodování klientů v oblasti financí. Součástí řešení byl centrální rozcestník finančních kalkulaček a jednotlivé specializované nástroje, mimo jiné:
  • kalkulačky půjček a financování bydlení,
  • nástroj pro konsolidaci půjček,
  • krokový nástroj pro refinancování,
  • porovnávače spořicích a investičních produktů.
  • Cílem nebylo vytvářet izolované aplikace, ale ucelený a konzistentní systém, který umožňuje:
  • snadnou orientaci v nabídce finančních produktů,
  • přímé porovnání variant,
  • plynulý přechod k dalším krokům v rámci online bankovních služeb.

Přístupnost a rozsah

Projekt vznikal v prostředí velké bankovní instituce s vysokými nároky na stabilitu, bezpečnost a konzistenci digitálních služeb.

Návrh musel respektovat existující design systém banky, interní standardy i regulatorní omezení typická pro finanční sektor.

Řešení bylo od začátku navrhováno s důrazem na přístupnost a použitelnost napříč širokým spektrem uživatelů, nikoli jako dodatečná úprava.

Součástí návrhu bylo zejména:

  • dodržení pravidel WCAG,
  • dostatečné kontrasty a čitelnost rozhraní,
  • ovladatelnost pomocí klávesnice i dotykových zařízení,
  • plnohodnotné fungování na mobilních zařízeních.

Cílem nebylo navrhnout jednotlivé nástroje izolovaně, ale vytvořit dlouhodobě rozšiřitelný a konzistentní systém, který zapadá do celého digitálního ekosystému banky a obstojí i při dalším rozvoji služeb.

Rozcestník jako vstupní bod

Byl navržen centrální rozcestník finančních kalkulaček, který slouží jako hlavní vstupní bod do celého ekosystému. Jeho cílem bylo zjednodušit orientaci v nabídce nástrojů a umožnit uživateli rychlý přechod ke konkrétnímu výpočtu bez nutnosti zbytečného hledání.

Rozcestník:

  • zjednodušuje orientaci v široké nabídce finančních nástrojů,
  • umožňuje okamžitý vstup do relevantního výpočtu,
  • funguje jako přirozený konverzní bod v rámci digitálních služeb banky.

Nejde pouze o navigační prvek - rozcestník je součástí rozhodovacího procesu, který uživatele provází od prvotní orientace až k dalším krokům.

Porovnání produktů jako základní UX pattern

Klíčovým principem návrhu bylo přímé porovnání finančních produktů a jejich variant. Rozhraní bylo navrženo tak, aby uživatel mohl sledovat rozdíly v klíčových parametrech - jako je výše splátky, úroková sazba nebo celková úspora - pod sebou, v jednom kontextu.

Horizontální rozvržení:

  • odpovídá přirozenému způsobu rozhodování založenému na porovnávání,
  • snižuje kognitivní zátěž tím, že eliminuje nutnost přepínání mezi variantami,
  • urychluje orientaci v datech a podporuje informované rozhodnutí,
  • dodržuje poměr stran desktopových zařízení.

Porovnání zde neslouží pouze jako vizuální prvek, ale jako základní rozhodovací mechanismus celého systému.

Výsledek

Navržený ekosystém nebyl jednorázovým řešením, ale soustavou vzájemně provázaných nástrojů, které sdílejí společné principy, komponenty a chování.

Součástí ekosystému byly mimo jiné:

  • Půjčka na bydlení

Online kalkulačka s orientačním výpočtem v reálném čase a jasným oddělením informativní a závazné fáze rozhodování.

  • Konsolidace půjček

Nástroj pro sloučení stávajících půjček s přehledným zobrazením úspory, změny měsíční splátky a dopadu na rodinný rozpočet.

  • Refinancování

Krokový průvodce porovnávající nejčastější scénáře refinancování bez nutnosti složité orientace v produktech.

  • Rekonstrukce bydlení

Kalkulačka pro plánování financování rekonstrukce s návazností na doporučené produkty banky.

  • Porovnávače spořicích produktů

Nástroje pro srovnání spoření a investic na základě jednoduchého zadání.

Každý nástroj funguje samostatně, ale zároveň zapadá do jednotného systému, což uživatelům zajišťuje konzistentní zkušenost napříč digitálními službami banky.

Dopad a přínos

Navržený ekosystém přinesl přínosy jak pro uživatele, tak pro banku:

  • Snížení kognitivní zátěže

Komplexní finanční rozhodování bylo převedeno do srozumitelného a strukturovaného procesu.

  • Vyšší sebeobslužnost uživatelů

Klienti jsou schopni samostatně porozumět produktům a porovnat varianty bez nutnosti okamžité konzultace.

  • Přirozená podpora konverze

Kalkulačky fungují jako vstupní bod k dalším krokům bez nátlaku na předčasné rozhodnutí.

  • Škálovatelný základ pro další rozvoj

Modulární architektura umožňuje rozšiřování ekosystému o další produkty bez narušení celku.

  • Posílení důvěry v digitální nástroje banky

Konzistentní chování, přístupnost a respekt k bankovní identitě podporují vnímání stability a profesionality.

Shrnutí projektu

Tento projekt ukazuje, že i vysoce komplexní a regulované finanční služby lze navrhnout jako přehledný, přístupný a dlouhodobě udržitelný digitální systém, který podporuje jak potřeby uživatelů, tak obchodní cíle organizace.