Bachelor's Thesis

User-friendliness of the Council Voting System

Final Thesis 12.42 MB

Author of thesis: Bc. Lukáš Etzler

Acad. year: 2024/2025

Supervisor: Ing. Kristýna Zaklová

Reviewer: Ing. Jiří Hynek, Ph.D.

Abstract:

The aim of this bachelor thesis was to analyze the initial state of the council voting system, primarily its responsiveness and user-friendliness on mobile devices, and based on the findings and problems identified, to design and implement a responsive interface that will solve these problems. The work also included rewriting the modified pages and components into TypeScript, in which it was required to write new components. During implementation, decomposition of the global style sheet was also done. The new components were implemented using the React library in TypeScript with the aim of maximum reusability and facilitating further extensibility of the system. Finally, the application was tested with a selected sample of users from a defined target group of users.

Keywords:

council, council voting, React, user experience, redesign, mobile-first, usability

Date of defence

20.06.2025

Result of the defence

Defended (thesis was successfully defended)

znamkaBznamka

Grading

B

Process of defence

Student nejprve prezentoval výsledky, kterých dosáhl v rámci své práce. Komise se poté seznámila s hodnocením vedoucího a posudkem oponenta práce. Student následně odpověděl na otázky oponenta a na další otázky přítomných. Komise se na základě posudku oponenta, hodnocení vedoucího, přednesené prezentace a odpovědí studenta na položené otázky rozhodla práci hodnotit stupněm B.

Topics for thesis defence

  1. Redesign byl proveden pro část systému reprezentující detail municipality. Jakým způsobem je nyní možné řešení rozšířit na celý systém?
  2. Jak bude řešení respektovat případnou aktualizaci knihovny PrimeReact? Jak v takovém případě postupovat?
  3. Na základě čeho jste se rozhodl, jaké změny uživatelského rozhraní jsou potřeba?

Language of thesis

Czech

Faculty

Department

Study programme

Information Technology (BIT)

Composition of Committee

prof. Dr. Ing. Jan Černocký (předseda)
doc. Ing. Martin Čadík, Ph.D. (člen)
Ing. Vojtěch Mrázek, Ph.D. (člen)
Ing. Aleš Smrčka, Ph.D. (člen)
Ing. Matěj Grégr, Ph.D. (člen)

Supervisor’s report
Ing. Kristýna Zaklová

Student se snažil, aby změny ve vzhledu systému vycházely jak z doporučení pro použitelná uživatelská rozhraní, tak z identifikovaných nedostatků stávajícího řešení. Implementovaný redesign byl testován s vybraným vzorkem uživatelů, kteří ocenili rozšíření v podobě globálního vyhledávání napříč funkčním obdobím daného zastupitelstva a spodní navigace na mobilních zařízeních. I přes výše uvedené výtky se jedná o zdařilé řešení, proto navrhuji hodnocení stupněm B.

Evaluation criteria Verbal classification
Informace k zadání

Zadání vzniklo jako pokračování projektu pro zpracování, analýzu a vizualizaci dat ze zasedání zastupitelstev. Student provedl analýzu klientské části systému a jeho nedostatků s důrazem na responzivní zobrazení. V rámci implementace měl kromě redesignu současného řešení za úkol dva hlavní cíle – převést existující řešení pro zobrazení dat jednoho zastupitelstva z jazyka JavaScript do jazyka TypeScript a zredukovat globální stylový soubor do dílčích, které se budou vztahovat k jednotlivým komponentám uživatelského rozhraní. Implementační výstupy měly být dodány s větším předstihem, aby bylo možné provést pečlivější testování a vyladit rozložení rozptýleného obsahu na desktopových zařízeních. Zadání hodnotím jako průměrně obtížné.

Práce s literaturou

Student nastudoval doporučenou literaturu a aktivně vyhledával další relevantní zdroje. 

Aktivita během řešení, konzultace, komunikace

Student byl aktivní během celého akademického roku, nicméně měl aktivnější a méně aktivní období, která se střídala. Porady probíhaly v zimním semestru každých čtrnáct dní, v letním semestru každý týden. Některých porad se neúčastnil a jeho reakční doba byla občas delší. 

Aktivita při dokončování

Závěr technické zprávy byl dopisován těsně před termínem odevzdání, obsah byl sice konzultován, ale s ohledem na časové možnosti student zohlednil a zapracoval pouze některé mé připomínky. V technické zprávě bohužel zůstaly i nedostatky, na které jsem upozorňovala a bylo možné je odstranit.

Publikační činnost, ocenění

Points proposed by supervisor: 83

Grade proposed by supervisor: B

Reviewer’s report
Ing. Jiří Hynek, Ph.D.

Student splnil zadání. Provedl rozsáhlý redesign vizuální podoby informačního systému. Práce obsahuje některé výše uvedené nedostatky. Navrhuji hodnocení stupněm B.

Evaluation criteria Verbal classification Points
Náročnost zadání

Evaluation level: průměrně obtížné zadání

Cílem práce bylo vylepšit existující systém pro vizualizaci hlasování zastupitelstev [1] tak, aby lépe odpovídal současným požadavkům na responzivitu a uživatelskou přívětivost. Student analyzoval původní stav systému vycházející z bakalářské práce [2], identifikoval klíčové nedostatky a navrhl jejich řešení. Pro návrh použil nástroj Figma, řešení implementoval v jazyce CSS, TypeScript a knihovně React. Zadání práce hodnotím jako průměrně obtížné.

[1] ZAKLOVÁ, Kristýna. Analýza a vizualizace dat z hlasování Zastupitelstva města Brna. Brno, 2023. Diplomová práce. Vysoké učení technické v Brně, Fakulta informačních technologií. Vedoucí práce: Ing. Jiří Hynek, Ph.D.
[2] OSINEK, Pavel. Uživatelská přívětivost systému hlasování obecních zastupitelstev. Brno, 2024. Bakalářská práce. Vysoké učení technické v Brně, Fakulta informačních technologií. Vedoucí práce Ing. Kristýna Zaklová

Prezentační úroveň technické zprávy

Práce je rozumně strukturována do jednotlivých kapitol. Celkovou srozumitelnost práce snižují místy stylisticky náročné pasáže, zejména ve formě rozsáhlých odstavců. Po obsahové stránce má nicméně některé nedostatky. Návrhová část místy přesahuje do popisu implementace. Popis implementace je na některých místech obtížně srozumitelný. Testování je zpracováno pouze stručně.

75
Formální úprava technické zprávy

Jazyková stránka práce je přijatelná, i když se místy objevuje neohrabané nebo neformální vyjadřování (např. výrazy jako „flexboxů“, „gridů“ nebo „data rozházená“) a občas chybí interpunkce, zejména tečky na konci vět. Typografické nedostatky zahrnují nevhodné použití uvozovek a pomlček, chybějící zvýraznění klíčových pojmů nebo špatné formátování výčtů. Některé obrázky obsahují anglické popisky, což narušuje jazykovou konzistenci práce.

65
Realizační výstup

Student provedl redesign části systému pro vizualizaci hlasování zastupitelstev, konkrétně detailu municipality. Implementoval nové grafické komponenty v jazyce TypeScript a provedl refaktorizaci stylových předpisů. Soustředil se na responzivnost řešení. Vytkl bych zejména absenci některých prokliků do detailu hlasování z jiných pohledů. Obecně řešení hodnotím kladně.

85
Využitelnost výsledků

Výsledky jsou v případě zapracování zpětné vazby týmu projektu Zastupko potenciálně využitelné v systému pro vizualizaci hlasování zastupitelstev.

Rozsah splnění požadavků zadání

Evaluation level: zadání splněno

Rozsah technické zprávy

Evaluation level: je v obvyklém rozmezí

Práce s literaturou

Student prostudoval velké množství zdrojů, avšak převažují mezi nimi online články a webové stránky.

80
Topics for thesis defence:
  1. Redesign byl proveden pro část systému reprezentující detail municipality. Jakým způsobem je nyní možné řešení rozšířit na celý systém?
  2. Jak bude řešení respektovat případnou aktualizaci knihovny PrimeReact? Jak v takovém případě postupovat?
Points proposed by reviewer: 80

Grade proposed by reviewer: B

Responsibility: Mgr. et Mgr. Hana Odstrčilová