Kulcs Flow

This project focused on modernizing Kulcs Üzlet’s invoicing software, with a strong emphasis on usability and visual coherence.

Responsibilities:
ideation, information architecture, low fidelity and high fidelity UI design

My role:
Product Designer

Goal

My task was to redesign the invoicing software Kulcs Üzlet to improve both its user interface and interaction design.

Scope

  • Complete visual overhaul with a refreshed UI
  • Redesigned information architecture
  • Improved interaction design
  • No loss of existing functionality

    • Out of Scope

    Introduction of new features

    Starting Point

    There was no existing design system. I had access to design materials from a previous project, which served as a visual reference.

    Design Library

    I began building a dedicated design library to support the redesign. More details about this initiative can be found [here].

    Design Highlights

    Home Page

    Replaced the outdated tile-based layout with streamlined navigation and introduced a new page structure featuring recent invoices and data cards.

    Settings

    The settings section lacked consistency — some areas used tile-based layouts, while others relied on overlapping modals, leading to a fragmented and confusing user experience. I unified the experience with left sidebar navigation and consistent layout.

    (Invoice) List Page

    My goal was to improve scannability by showing more of the list at once, using progressive disclosure to keep only the most essential options visible by default. All actions and filtering options remain easily accessible when needed. I replaced the "Műveletek" (Actions) button with expandable invoice rows to enhance usability and streamline interaction. Adapting the document list for mobile was an interesting challenge. I explored various industry approaches but found no clear standard. I decided to present all key information from the desktop list view within a mobile-friendly card layout. Tapping a card reveals the available action buttons, ensuring both clarity and functionality on smaller screens.

    New (Invoice) Form

    Redesigned the form layout to be clearer and more structured, using sections for easier data input and readability.

    Conclusion

    This redesign brought a consistent visual language and clearer interaction model to Kulcs Üzlet's invoicing software, making everyday tasks faster and easier to scan — all without changing the functionality users already relied on. The design library built along the way sets the foundation for future updates.