Mirror of the Rel4tion website/wiki source, view at <http://rel4tion.org>

[[ 🗃 ^yEzqv rel4tion-wiki ]] :: [📥 Inbox] [📤 Outbox] [🐤 Followers] [🤝 Collaborators] [🛠 Commits]

Clone

HTTPS: git clone https://vervis.peers.community/repos/yEzqv

SSH: git clone USERNAME@vervis.peers.community:yEzqv

Branches

Tags

master :: projects / razom /

user-interface-design.mdwn

I want to design some GUI widgets and interfaces for use with Razom as a backend. In order to eventually acheive good designs ready to be implemented, I need to plan then and develop them carefully, while studying existing similar interfaces. So in general I’ll need two things:

  1. Learn about UI design practices
  2. Create a template for developing designs

For 1, search “user interface design” in StartPage and start reading (and downloading). Also, there is an awesome list of resources here. For 2, I can use the GNOME design team’s templates and guidelines. In other words, I need to have the HIG and the design page template.

HIG book: - stable version for my stable debian can be found in package gnome-devel-docs, folder /usr/share/gnome/help/hig-book. Maybe it can be read using Yelp too, let’s see… yes, it can. I have HIG 2.2.2. - latest version is just a bit ahead - 2.2.3 - and it just updates a few links, nothing more, so there’s no reason to use it

Design template: here

Also design pages to use as an example: here

Until I start using these guidelines, I’d like to start a bit.

Query Creator Widget

Data can be filled into GUI widgets in endless ways, and the choice of the widget depends on the GUI design and usage pattern. It can be a list, a tree, a form, a graph, a text view… everything is possible. However, some patterns are very common and writing general-purpose widgets to automate their work would be very useful. Here I’d like to design a query editor widgets for a table view, e.g. a GtkTreeView containing data from a GtkListStore.

Examples:

In other words, this is the table view resembling the way SQL databases organize data: in tables. A widget of this kind can help make the transition from an SQL-backed system to a Razom-backed system.

The thing I want to design here is not the table view, but the chooser which allows one to control what gets displayed in the table. I see 3 obvious approaches:

  1. Have some default view, and using right-click->insert/remove/move the user can change the table columns. This is how Evolution’s mail view works.

  2. Have a full widget through which the user can choose columns, determine their ordering for sorting, add conditions to apply to them and even more advanced things like manually entring a Razom query. This is how GNOME Desktop Search and Bugzilla work.

  3. Combined approach: Things can be added using a right-click menu, but it is not limited to column names, but can also add expressions and conditions and so on.

Since 1 and 2 are mainly usability shortcuts and probably won’t work well for complicated queries, I’ll start with number 2 and later take care of the othe two. Next step: I want to do 2 things in parallel:

Where to take examples? I’m opening a list here:

Let’s start taking screenshots…

[See repo JSON]