What we design

Dear readers,

We have just realized that we have been working on our platform for months, without showing you any overview, and that it is actually hard time to.
Since MoneyLab (early December), we have been thinking about ways to improve online’s reading. We have created specific functions that would allow for an easy navigation and orientation on the website. Some of those were basic and already existing on some other websites, some others are more experimental.

Let’s detail it!

Navigation
One can notice several different ways, in which one can navigate to the next chapter or another desired position on the page using arrows, menu links and so on. However, we did not want to flood readers’ screen with too many interactive objects, as the act of reading and understanding the text was not something we wanted to replace with the interactive potential of the web, but rather to enhance it and facilitate comprehension and the navigation.
That is one of the main reasons we made the menus containing most interactable elements be able to close and open easily. The users/readers are free to decide whether they want to close the menus in order to have a clean interface and concentrate more closely on the text, or open them and make use of the handy functions we implemented.

Search
The search function resembles any other search bar that can commonly be found on most websites. The text in the input field autocompletes as one types, the results are highlighted in yellow, the ‘next’ and the ‘previous’ button bring to the respective instances and can be activated with the keyboard key (enter) as well. It basically works as a common search function, but the difference is that this tool proposes a list of keywords based on the content of each publication, in order to help the user browsing.

search function

Referencing tool
This tool generates the correct reference for the selected article in three different citing conventions (MLA, Chicago, and APA). It can also be activated by clicking on the command ‘Reference this’ in the menu that appears on text selection.

referencing tool

Keywords
Since article-specific keywords were not submitted from the authors, we decided to generated them using a tool that finds the most common terms in an article and add them at the beginning of each article. The keywords can be toggled on and off individually or collectively in the ‘Settings’ panel. Once activated, they highlight the respective word in blue colour, for an easier recognition and overview of the important terms and topics in a text.

keywords

Highlight
One can highlight the text by selecting the desired text with the pointer and clicking on the ‘Highlight’ menu optiont. If one wants to remove the highlighted text, it is enough to select the highlighted area and click the ‘Unhighlight’ option. One can also display all highlight or hide it all by using the appropriate buttons in the ‘Settings’ panel.

highlight

Pinning your position
The pin in the menu on the right can be dragged and dropped on the page. This saves the current position on the screen, and the pin can be clicked again to restore the same position. It is saved in local storage, which means that the dropped pin will reappear if the user visits the page again. What’s more it can be tagged and edited at will.

pin

Print option
It is possible to print a copy of the book directly from your printer, without the menus and the tools appearing on the website. What you print is just what you are interested in: the content. Technically, it is just made with a very basic new CSS file that loads on print, especially designed for A4 format.

That’s it for now! 😉

Share