Introduction to the application

Once you create your account you will be able to access Genialis Expressions. This short introduction will explain what the interface of Genialis Expressions app looks like and how it is structured.

Please note that we recommend you use Chrome browser for best results in Genialis Expressions.

Expressions Layout

A - Top Bar

The top bar contains information that you can access from anywhere in the app. It is fixed on top of the screen which means it always stays in the same place even if you scroll the page.

From here you can:

bg-tasks See the status of all processes currently running on Expressions front-end in the Background Tasks list

export-data Export and download the data from the app

bookmarks Get bookmark URLs for sharing

help Access help pages

account Access your account information (Edit profile, Sign out)

B - Main navigation

Main navigation is used to navigate between pages and basket panels. In the navigation bar found on the left, pages and basket panels are represented with icons. Hovering over these icons displays tooltips with page/basket panel names. It also has a fixed position on the left of the screen which means it always stays in the same place even if you scroll the page.

C - Pages

Each page represents a rounded group of tasks that the user performs on the app. Genialis Expressions app consists of the following pages:

search-page The Search page is the landing page after logging into Genialis Expressions where you can search and view data that has already been imported. Here you can select collections and samples to explore them further in the Visualizations page or to organize your data and run custom tools and pipelines.

visualizations-page The Visualizations page is where you can visualize and explore your data.

import-page The Import data page is where you import your data to Genialis Expressions.

D - Tabs

Content within pages is often organized in meaningful tabs. For example, the Visualizations page might contain tabs like: Sample Comparison, Gene Expression, Differential Expression and Heat Map.

E - Cards

A card represents the smallest unit of content on the app. This usually means that a card displays a single visualization e.g., Volcano Plot, a table, e.g. Differential Expression Comparison Table, or some other content/functionality, e.g. Import Data. Typically 2-5 cards per tab are displayed.

Sometimes a single card is used to display complex features. In that case the content is structured by using:

  • separate sections in an expandable/collapsable harmonica format or

  • tabs within the card.

F - Basket panels

The basket panels can be accessed below the page icons in the main navigation bar. A basket panel will open by clicking on a basket icon. By default the panel overlaps the existing screen content. An open panel can be collapsed back in order to maximize your screen space or pinned so that the panel is integrated next to the existing content on your screen rather than overlapping it.

Basket Panels

There are three different basket panels available:

sample-basket The Sample Basket displays selected samples from the Search page or a collection for further exploration in the Visualizations page. The number of samples currently added to your Sample basket is indicated within the dot on the icon.

gene-basket The Gene Basket displays genes of interest that you select while exploring visualizations, e.g. selecting genes from the volcano plot, genes that you paste into the basket from an outside source or genes from previously saved gene sets. Genes displayed in the Gene Basket automatically populate all the relevant plots within the Visualizations page. The number of genes currently added to your Gene basket is indicated within the dot on the icon.

geneset-basket The Gene Set Basket displays your saved gene sets or pre-uploaded gene sets that are available to you. You can manage your gene sets within the Gene Set Basket, as well as create Venn diagrams to explore your saved gene sets even further.

Buttons

There are 2 main types of buttons used in Genialis Expressions:

  1. Regular buttons, which could be the blue primary buttons (used for the standard action) or the outlined secondary buttons (used for secondary actions or abandoning an action)

  2. Icon buttons, usually used in tables or cards to access quick actions or features

Buttons

Other elements

  1. Input field - where you enter an information

  2. Drop-down selection menu - where you select an option from a predefined list

  3. Search bar - where you search for an object

  4. Status icon - displays status information about a process

  5. Tooltip - displays additional information about something by hovering with the cursor

  6. Check box - where you select an object, usually in tables

  7. Toggle - where you switch a feature on or off

Other Elements