Screenshot of Fraction Task window
Back to Celeste's HCI Design Work
This is a usability review with interface recommendations of KDE Edutainment application KBruch version 3.4
KBruch is a KDE Edutainment application which helps children practice and learn fractions.
The target audience for the Edutainment applications are school children ages 3 to 18, however fractions are typically taught in middle school. Options in the application can make the tasks more difficult and suitable for an older audience.
There are four major tasks in KBruch: Fraction Task, Comparison, Conversion, and Factorization. The application keeps track of the number of tasks complete, and the user's score. The fractions are displayed in multiple colors which makes the interface engaging especially children.
The current maintainer is Sebastian Stein.
Issue severity:
Issue type:
Numbers in the workspace should be a larger font. The application is meant for a younger audience and larger numbers will help with visibility. The colored numbers are already a nice touch because it makes the interface more engaging.
Interaction
Minor
Pressing enter when focused in the text box should submit and check the task. Currently you have to always click the button which makes the interface awkward and slow.
Interaction
Minor
When the number of completed tasks is 0, the correct and incorrect number of tasks answered should read "0" and "0%" and not have blank dashes.
Interaction
Minor
A task is marked incorrect if a user selects "New Task" before answering the current task. A user should not be penalized for an incorrect answer unless they specifically choose to answer the task.
Bug, Interaction
Major
The 'New Task' and 'Check Task' buttons should not toggle. Make them seperate buttons and make the unavailable options unselectable.
Interaction, Usability
Major
Text box entry should be an appropriate size to reflect how long the answer will be. For example in Fraction Task, the text box entry should only be a few characters wide. This gives visual feedback to the user on what kind of answer they are expected to provide.
Usability
Minor
Suggest revising all instances of "task" to a difference word. In English (German, Korean, and perhaps other languages) this sort of "task" is more often referred to as a "problem" or "question". Terminology should be similar which is used in education.
Information Architecture, Usability
Major
Suggest changing "Check Task" to "Check Answer".
Information Architecture
Medium
All options on the toolbar should also be available in the menu bar.
HIG Violation
Medium
Suggest making reduced form answer an option to allow more flexibility in difficulty.
Functionality
Minor
Answers for fraction task are required to be in reduced form, however the text box layout does not facilitate this. Add a whole number text box for entering whole numbers.
Usability
Major
Suggest renaming "Fraction Task" to "Evaluate Fractions". "Evaluate" is a more common term for performing addition, subtraction, multiplication, and division actions on an expression.
Information Architecture
Medium
Suggest including equivalent fractions for comparison.
Functionality
Minor
The toggle answer button is not a good way for a user to select an answer. Display all options to the user and do not have a default answer selected.
Interaction, Usability
Major
These interface mockups contain strongly recommended interface changes. They do not include resolutions to issues stated, including renaming "task" to "problem" or "question".
The icons, fonts, spacing, and sizes used in the mockups are conceptual and should be adjusted accordingly.
The current KBruch interface is split in to four parts: menubar and toolbar, task mode buttons, work space, and score area.
As mentioned in the Usability Issues, there are items on the toolbar which are not available in the menubar. These items include choosing the number of terms to evaluate, setting the maximum main denominator, and choosing which operation to perform on the terms. These options only apply to the Fraction Task mode and have been moved to a mode options area.
In the reworked interface, a "guess" button (new document with green dot) is available next to the "new task" button.
The four task modes are available on the toolbar instead of in the document. Moving these buttons free up space in the interface and removes one of the "columns" in the document. Also, by moving the task modes to the toolbar, it gives the current task more focus.
In an alternate design, the task mode buttons could be kept as a navigation column on the left. This style is popular within KDE (eg: Kontact, Control) and would preserve the current interface style. In that case, the score area could be moved to the same space as the tasks, and the options for the tasks put in the configuration.
These buttons have been moved to the toolbar.
The work space has been changed significantly. The title of the task is presented on the document so the user knows what mode they are in. Short instructions of how to complete the tasks have been added to help the user determine how to complete each task. Keep in mind the primary audience is children who are learning fractions. Children may not know how to access the documentation to get directions on how to use the application, and they may not always remember how to complete the tasks they are practicing. Being friendly and explicit will help the user experience.
The size of the fractions has been greatly increased. The color and size will make the numbers easier to read and more engaging.
The solution has been moved beneath the work area. This balanced out the interface (design-wise) but does not intrude the user's focus (reading the score of "correct" or "wrong"). It is also displayed in a larger size to make the numbers more visible and engaging.
The "check answer" and "new task" buttons have been rearranged. "Check answer" has been moved closer to the text input area to reduce mouse movement and group the similar items together. The "correct" and "wrong" feedback has been moved to a close proximity to the check answer button so it is immediately noticed when the task is checked. The "new task" button has been moved to the lower right hand corner to the left and below of the "solution" area.
The score area has been moved and combined with the mode options in to one column. Some modes do not have options, and the score area will always be in the same position. Options for each mode will be presented to the user so they can reference what the answer requirements are, and can quickly change them from task to task.
The text input boxes have been made smaller to reflect the length of the answers. Longer boxes may give users the wrong impression of what kind of number the answer may be. A box for whole numbers have been added to make entering answers in reduced form easier and more intuitive.
Screenshot of Fraction Task window
Mockup of Fraction Task window (renamed to Evaluate Fractions)
The toggle button has been replaced with a set of option buttons. All possible solutions have been provided to the user to review and select, instead of having to remember the selection while toggling through the button options.
The equivalence ('==') button has been included as a concept example.
Screenshot of Comparison window
Mockup of Comparison window (renamed to Compare Fractions)
The text input boxes have been made smaller to reflect the length of the answers. Longer boxes may give users the wrong impression of what kind of number the answer may be.
Screenshot of Conversion window
Mockup of Conversion window (renamed to Convert Fractions)
There are a wide range of minor to major issues with KBruch, most of which have to do with the interaction and usability of the application. There are also a number of suggestions in game play and interface to help improve the application.
Most of the interface rework is for the general interface. Some of it is suggestion, in particular moving the mode buttons to the toolbar. It may end up the most effective way to present the user navigation of the different application modes is with the left document menu as previously designed. This type of navigation is commonly used throughout KDE. The major concern was the three-column layout of the document space, however there may be other ways of redesigning the mode options and displaying the user score.
It is, however strongly recommended to consider the individual task mode changes. These screenshots are implementations of possible fixes for the usability issues found in the interface.
There are no suggestions for the Factorization Task mode at this time. The general interface suggestions would apply to this mode.
Comments and questions about this review can be forwarded to Celeste (at) KDE (dot) org.