Tag: lexica

  • Designing Lexica: Can Design Help People Do The Right Thing?

    Designing Lexica: Can Design Help People Do The Right Thing?

    Duration

    December 2023–July 2025 (1.5 years)

    Role

    Product Designer

    What is done

    Creating design system, creating accessibility guideline, prototyping, and testing

    Introduction

    As mentioned in my previous blog post, I decided to design a mobile-first contribution tool focused on lexicographical data (words, phrases, etc.) on Wikidata, now called Lexica. Through Lexica, I want to proof that:

    1. Good design alone can help users make high-quality contributions to Wikidata with less human error.
    2. A well-designed tool will be appreciated by contributors regardless of their experience levels.
    3. A Wikidata tool that feels similar to the Wikidata interface helps establish trust.

    This is all done by leveraging guardrails, purposeful limitations, and subtle aspects of gamification. Here’s how I did it.


    Understanding the challenge

    When approaching Lexica’s design, I wanted a solution that felt intuitive, made complex information understandable, and, most importantly, guided users to make better contributions.

    The tool’s priorities presented what initially seemed like fundamental contradictions:

    • Increasing both the quantity and quality of contributions
    • Increasing ease of use and reducing errors
    • Presenting curated and randomly-chosen Lexemes
    • Creating a native-feeling and fresh, innovative user interface
    • Being as simple as possible without hiding how Wikidata structures information

    Instead of viewing these contradictions as obstacles, I saw them as opportunities to create a new kind of user experience—one that helps users do the right thing without compromise.

    From the very beginning, Lexica has always been designed for less experienced contributors as the main audience. This means explicitly not allowing mass editing and automated editing. Other great Wikidata tools, such as QuickStatements, can handle such scenarios.


    Leveraging guardrails

    Editing in Wikidata can be daunting for many because there are so many things that can define a Lexeme. What needs to be added? Which section should the contribution be placed in? What values can be included? And most importantly: what’s the correct syntax for each value? These are questions that many users struggle with, often resulting in unintentional errors and a lack of standardization that experienced community members then have to address.

    Adding a statement to Wikidata. Notice the need to remember the exact string of the Statement and value.

    To mitigate this, I designed Lexica with guardrails to handle these complexities. Lexica curates Lexemes, defines what needs to be added, and presents an interface where syntax errors are impossible. Instead of allowing users to freely input text, Lexica presents choices, except in specific cases (e.g., writing script variants of languages). This way, users never have to worry about making syntax mistakes or missing important details.

    Lexica shows users options to select an Item that eliminates error-prone free-form text.

    Adding the fun of playing card metaphor

    Gamification typically relies on elements like leveling up, social interactions, and competition. However, I decided to use a more literal approach, inspired by the desktop metaphor.

    In Lexica, I used playing card metaphor to structure tasks. Cards effectively group discrete pieces of content in a manageable way. Just like a shuffled deck of cards, every Lexeme shown to users is randomized. Users interact with a stack of cards, which is set aside once completed or discarded if unsolvable. These cards are referred to as “task cards”.

    GIF of Lexica task cards that shows stacked and draggable nature of the element
    Task cards uses playing card metaphor such as stacking and dragging.

    Additionally, I incorporated another literal metaphor: hyphenation (“syllabification”). Just as hyphenation splits words into syllables, Lexica allows users to divide a Lexeme directly. Imagine cutting a baguette into pieces—users get to slice the Lexeme into its respective syllables. Whenever users scroll to the gap in between letters, Lexica can give subtle haptic feedback on supported platforms. This metaphor helps familiarize a relatively uncommon concept, adds tactility to the task, and makes quick scrolling easier.

    Illustration of Lexica hyphenation activity: shown lexeme is "adikarya" with a left-right arrow background
    Adding hyphenation in Lexica is as simple as scrolling and dividing.

    While most tools for editing Wikidata tends to be more utilitarian in design, Lexica’s playful approach makes contributions feel more like a game, making complex information easier to digest without overgamifying the experience.


    Structure the contribution as a mystery game

    The process of making a contribution in Lexica is structured like a mystery. In a mystery, a problem is presented, clues must be uncovered, and tools are used at your disposal to help piece things together. Lexica mirrors this:

    • The problematic Lexeme is clearly presented in front of the user.
    • Clues are revealed by flipping over cards, allowing the user to uncover the information needed.
    • Lexica then presents recommendations based on what they’ve discovered while also allows the freedom to manually find answers.
    A collage of steps to solve Lexica Lexeme to Wikidata Item linking activity: showing Lexeme info, showing Item info, previewing the change, and finishing the task card.

    Once everything is in place, Lexica gives a preview screen, presenting the “big picture” before submitting the contribution. This approach empowers users, making them feel like they’ve solved a mystery.


    Focused and finite contribution

    Most Wiki tools are designed for power users who want to accomplish many tasks at once, which can be overwhelming for those with less technical expertise. Lexica, on the other hand, shows only one problem at a time, focusing the user’s attention on a single task.

    To achieve this, I separated detailed information about Lexemes (language-specific) from Items (general concepts). Additionally, I separated the contributing screen from the preview screen. This helps avoid cognitive overload and allows users to focus on the task at hand.

    Additionally, by numbering each contribution and subtly thinning the deck of cards as the session progressed, Lexica helps prevent burnout because users aren’t confronted with endless cards.

    Lastly, every contribution session is limited to only five Lexemes at a time based on user feedback on how long they usually do sustained contribution on the go. There’s no limit on how many session users can do, however, so more engaged users can still do larger volume of edits.


    Familiar, yet fresh interface

    Lexica’s user interface is built on top of Codex, a unified design system used by Wikimedia. Codex provides a set of components and guidelines that allow third-party developers to create Wiki-style interfaces, using design language that users already know and trust. By using Codex, we can implement:

    • Dark mode for a more comfortable viewing experience
    • Responsive interface to support various screen sizes
    • Multi-language crowdsourced translations support through TranslateWiki

    We also created our own custom components by closely following the design system’s standards. This makes Lexica feels right at home in the Wiki ecosystem.


    Accessible by design

    Accessibility was a top priority in Lexica’s design. Since Lexica is very text-heavy by nature, Lexica provides high-legibility Atkinson Hyperlegible Next font to enhance text readability across a variety of devices and environments. For users who are motion-sensitive, we also included a reduced motion feature.

    Further, Lexica also incorporated ARIA (Accessible Rich Internet Applications) labels, appropriate alt text, and adhered closely to Codex’s accessibility guidelines. This ensures that all users, regardless of their abilities, can interact with Lexica in a meaningful way.

    List of accessibility features in Lexica, categorized into text options, reduced motion, and assistive technologies support.

    While we can’t conduct extensive accessibility testing due to time constraints, we ensured that the most essential elements were in place to improve the user experience for a diverse audience.


    Testing and improvements

    Before launching Lexica, we conducted usability testing to identify potential UX issues. Through both user feedback and internal review, we refined several areas of the interface. Here’s a summary of them:

    1. Clearer button labels

    Initially, some button labels were ambiguous and led to confusion about their function. After testing, we reworded several labels to make them clearer and more actionable, ensuring that users could easily understand what each button did without needing to guess.

    2. Removal of cooldown timer

    The initial design included a cooldown timer to prevent users from submitting too many contributions in a short time. However, this approach was too restrictive, causing frustration. After testing, we removed the cooldown timer entirely. We decided to add a little friction by requiring navigation to the homepage to start another session instead.

    3. Color contrast issues

    Testing revealed several color contrast problems. We revised the color palette, ensuring that all text, buttons, and important elements meet the WCAG 2 (Web Content Accessibility Guidelines) for contrast.

    4. Distinction between Lexeme and Item

    There was some confusion among users regarding the distinction between Lexemes and Items. We made this clearer by using two different color schemes and iconography between the two.

    5. More search results

    Users expressed frustration with the search functionality, especially the hard limit on search results shown in the first prototype. After testing, we implemented a way to load more search results.

    6. Position of buttons

    The placement of several key action buttons, such as “Skip” and “End session” buttons was not positioned well and hard to reach. We moved these buttons to the bottom and added text labels.

    7. Unfamiliar iconography

    Some of the icons such as home and skip were hard to identify. We replaced those with more recognizable icons from the Codex icon set.


    Results

    The results from Lexica’s usage data confirm that good design can indeed have a profound impact on user behavior and contribution quality.

    As of the end of July 2025, Lexica has facilitated 2100+ edits with an error rate of less than 5%. Usage patterns also show that Lexica is actively utilized by contributors of all experience levels, with a notable majority being newcomers. This strongly indicates that by providing choices rather than open-ended inputs, most users could produce high-quality contributions with minimal mistakes.

    Interestingly, hyphenation activity makes up 57% of all contributions, significantly more than other activities even though it is the newest activity launched. This indicates that Lexica’s experimental approach is most effective when the interface is highly interactive and specific, avoiding the feel of mundane data entry.


    Conclusion

    Every design choice in Lexica, from the metaphors and structured interactions to the guardrails and native-like interface, was an experiment to find ways to improve Wikidata editing experience. The data and feedback confirm Lexica has become a tool that people trust, value, and use effectively.

    This outcome highlights the true power of good design: contributors at all skill levels can edit with confidence. The low error rate, combined with the high number of contributions, proves that a focused, user-centered interface can significantly enhance both the quality and quantity of user-submitted content.

    As we finalize Lexica and wrap things up, I want to thank everyone who supported Lexica during its development phase. Your feedback was invaluable in refining the tool and shaping its design. From initial usability testing to additional suggestions after launch, your insights have been critical in making and improving Lexica into a tool that works for everyone.

    If you haven’t already….

    Lexica requires OAuth authorization from your Wikimedia account to identify your contributions to Wikidata.