Bachelor's Thesis

User-friendliness of the City Councils Voting System

Final Thesis 4.57 MB

Author of thesis: Ing. Pavel Osinek

Acad. year: 2023/2024

Supervisor: Ing. Kristýna Zaklová

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

Abstract:

This bachelor thesis deals with the user-friendliness of the system for the visualization of the Brno City Council voting. The aim of the thesis is to analyze the initial state of the system, and based on the findings, to design and implement a redesign of the user interface, with an emphasis on user-friendliness, also in the smartphone display version. The implementation included adding extensions to the system. The theoretical part summarizes elementary information about the municipal councils and possible ways of presenting data from their meetings. The concepts of user-friendliness and data visualization are also explained. The created redesign was implemented using Cascading Style Sheets and the React, Chart.js and PrimeReact libraries. The practical part of the thesis also includes refactoring and optimization of the client side of the application. The system was tested by a representative group of users. The findings of this thesis include a survey of the target user group, the design and the implementation of a user-friendly interface of the system and its extension.

Keywords:

user experience, accessability, usability, user interface, redesign, frontend, webdesign, data visualisation, web application, React, PrimeReact, CSS

Date of defence

14.06.2024

Result of the defence

Defended (thesis was successfully defended)

znamkaCznamka

Grading

C

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 C.

Topics for thesis defence

  1. Bylo by možné vhodně graficky porovnávat shodu mezi zastupiteli a subjekty v čase? Navrhněte možné řešení.
  2. Jaké informace uživatel ve vaší aplikaci hledá nejčastěji?
  3. Jak bylo dosaženo zlepšení výkonu? Která z provedených modifikací měla největší přínos?

Language of thesis

Czech

Faculty

Department

Study programme

Information Technology (BIT)

Composition of Committee

doc. Ing. Vítězslav Beran, Ph.D. (předseda)
Ing. Radek Hranický, Ph.D. (člen)
doc. Ing. Tomáš Martínek, Ph.D. (člen)
Ing. Marek Šolony, Ph.D. (člen)
Ing. Filip Orság, Ph.D. (člen)

Supervisor’s report
Ing. Kristýna Zaklová

Student se snažil, aby změny ve vzhledu systému pro hlasování obecních zastupitelstev vycházely jak z doporučení pro použitelná uživatelská rozhraní, tak ze zpětné vazby cílových uživatelů. Implementovaný redesign byl opět testován s vybraným vzorkem uživatelů, nicméně toto testování bylo již kvůli časovým možnostem méně důkladné. Student sice nad rámec zadání provedl refaktorizaci zdrojových kódů klientské části aplikace a některé optimalizace (např. rychlejší načítání stránek), ale uživatelské rozhraní není zcela odladěné. Navrhuji proto hodnocení stupněm B.

Evaluation criteria Verbal classification
Information about assignment

Zadání vzniklo jako pokračování projektu pro zpracování, analýzu a vizualizaci dat ze zasedání Zastupitelstva města Brna. Student provedl analýzu vytvořeného systému a jeho nedostatků ve spolupráci s cílovými uživateli. Dále si nastudoval technologie, které systém využívá a vyhodnotil jejich vhodnost, ev. limitace. 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í (nejen z hlediska funkcionality, ale především samotný redesign a jeho přívětivost na mobilních zařízeních). Zadání hodnotím jako průměrně obtížné.

Work with literature

Student nastudoval doporučenou literaturu a aktivně vyhledával další relevantní zdroje. Kromě zdrojů pro teoretickou část práce se zaměřil také na zdroje zabývající se doporučeními a osvědčenými postupy pro samotnou implementaci.

Activity during solution, consultations, communication

Student byl aktivní během celého akademického roku. Dodržoval dohodnuté termíny a na konzultace, které probíhaly pravidelně, býval připraven. Na mé zprávy vždy reagoval rychle, výtky a náměty na vylepšení ochotně řešil a zapracovával.

Activity during completion

Závěr technické zprávy byl dopisován před termínem odevzdání, student měl kvůli krátkodobé nemoci v letním semestru odklad odevzdání své práce o týden. Nicméně obsah byl řádně konzultován a student mé připomínky zohlednil.

Publication activity, awards

Points proposed by supervisor: 85

Grade proposed by supervisor: B

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

Student splnil zadání. Výstupy přispějí ke zlepšení dostupnosti otevřených dat. Navrhuji hodnocení stupněm C.

Evaluation criteria Verbal classification Points
The difficulty of the assignment

Evaluation level: moderately difficult assignment

Cílem práce bylo vyhodnotit uživatelskou přívětivost informačního systému pro vizualizaci hlasování z městských zastupitelstev [1]. Student musel provést důkladnou analýzu uživatelských potřeb, detekovat kritická místa a navrhnout vhodné úpravy uživatelského rozhraní.  Mimo jiné provedl optimalizaci zdrojových kódů klientské části informačního systému. Zadání 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.

Presentation level of the technical report

Text je rozumně rozčleněn na teoretickou část pojednávající o práci zastupitelstev a použitelnosti webových aplikací. Praktická část představuje analýzu, návrh, implementaci a testování. Vytkl bych zejména občasné vágní vyjadřování. Návrh uživatelského rozhraní nebyl dostatečně vysvětlen v kontextu potřeb uživatelů. Teorie pojednávající o tvorbě uživatelsky přívětivých vizualizací nezohledňuje otevřená vládní data.

75
Formal preparation of a technical report

Formální úroveň technické zprávy je na dobré úrovni. Až na některé drobnosti (např. velké písmeno knihovny Chart.js) jsem neshledal kritické problémy.

90
Realisation output

Výstupem práce je modifikovaná verze informačního systému využívající nový vzhled. Student provedl redesign jak prezentační logiky, tak aplikační logiky klientské aplikace, což považuji za velmi užitečné. Přínos úprav uživatelského rozhraní je však v některých případech značně diskutabilní (např. přehled politických stran pomocí počtu mandátů). Očekávám, že před nasazením do produkce bude nutné provést některé další úpravy.

70
Usability of results

Výsledky jsou využitelné v rámci projektu zastupko.cz.

The extent to which the requirements of the assignment have been met

Evaluation level: assignment fulfilled

Extent of the technical report

Evaluation level: is within the usual extent

Work with literature

Student prostudoval dostatečné množství zdrojů.

85
Topics for thesis defence:
  1. Bylo by možné vhodně graficky porovnávat shodu mezi zastupiteli a subjekty v čase? Navrhněte možné řešení.
Points proposed by reviewer: 75

Grade proposed by reviewer: C

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