Leggi: Academic Reader

Desktop Application Design

Leggi is a desktop application application that keeps your reading and thinking organized.

In this project, I interviewed 5 professors at RIT and undertood what they need for an application that facilitates academic reading. The interviews provided many insights which became the stepping stone of the design. The focus of the design was to provide a completely new experience of reading that satifisfies users' specific needs in academic reading. 3 iterations of prototypes were made. The last iteration is shown here.

Individual Class Project at RIT

Worked on:

  • Contextual inquiry: interviews, affinity diagram, personas, requirement extraction
  • Concept and ideation
  • Wireframing, designing and developing prototypes

Tools used:

Adobe Illustrator, HTML, CSS, Javascript


Reading for academic purposes is a long and hard process. Different from recreational reading (such as reading a novel), academic reading requires the reader to organize, analyze, synthesize and repurpose information from the reading materials. The reader has to collect fragments of information across multiple books/articles and it is a challenging task to keep track of these fragments and analyze them later.

  • difficult to read many books/articles at the same time
  • difficult to extract excerpts from articles
  • difficult to organize fragments of information


The goal of the desktop application is to facilitate academic reading by providing a way to organize, analyze information from readings. Help with organizing readings (on the level of articles/books/quotes) and their thought/ideas.

The designed desktop application has the following features

  • keep and manage all books/articles in one place
  • readings can be organized by projects
  • highlighted texts are automatically exported
  • use Tags and Groups to organize highlights
  • provides a consolidated workspace with panels where all actions happen


Click here to see full prototype in a new page

Design Process

Contextual Inquiry

Design the Experience

Design the Interface

Contextual Inquiry


5 Interviews

I interviewed 5 professors at RIT to learn more about how they do academic reading.

Summary of Interview Questions

Interview Results

Affinity Diagram

Key Findings

3 steps of work

Three steps of work are identified: reading for information, organizing information, and writing. These three steps are often carried out in different tools (paper, notebook, Microsoft Word, Amazon Kindle)

Iterative Process

Academic reading is an iterative process in contrast to regular reading which is usually linear. It involves switching betwen different books/articles; switching within a piece of reading; switching between reading, taking notes, organizing notes, writing, and etc.

Information is fragmented and scattered

Interviews show that only small portions of the reading are selected and used later. Interviewees underline or highlight parts of texts and write comments next to them on the book itself or on a notebook or laptop. These segments of texts are scattered across books and there isn't a place to put them together

Lack of filing system

Interviewees use Finder (and its conterpart on a PC) to organize readings. The problem is each file has only one name, but it takes more than a name to identify a book/article. People need to know the author, year, title and other information. Finder doesn't have such features. Some intervieweed use abbrebations to name files. But overall, the filing system they use is chaotic.

Information is compressed first and then expanded

To process all the segments of readings, interviewees first abtract the information into a few words or sentences to capture the main point and mark the page number and author's name. Later when they are writing the paper, they use these words to as guide to go back to the source and get the full text.

Filtering information

To begin with, interviewees don't know what information needs to be selected. They will underline texts that are loosely related to the research; and as they read more and have a clearer vision they will filter out less relevant information. Filtering is done mulitples times throughout the reading

Construct quotes

It is a common need to make a direct quote (verbatim) in papers. Intervieweed usually just put down an identifier of the quote and go back to copy the exact text later in writing.

Locating information

Interviewees use page number and author names to locate specific pieces of information.


1. Design an interface that allows the user to perform the 3 steps of work (reading, organizing and writing) in one place. User can switch between these steps freely. It should be an iterative process not linear.

2. User should be able to highlight/underline texts in readings. Underlined texts can be exported and organized later. Underlined texts will have links to their sources. User should be able to write comments next to the texts.

3. Quotes or highlited texts can be easily traced back to their sources.

4. Quotes or highlited texts can be organized in some way according to users' needs. A mechanism that allows grouping of quotes with similar qualities.

5. A filing system that organizes books, articles, files according to project. Basic information such as author name, year, title needs to be displayed. One piece of reading (book/article) can be used in different projects without creating multiple copies.


Deisgn the Experience

Work Flow


  • Three steps: read, organize, and write.
  • Iterative process: freely switch between any two steps.


since most people use Microsoft Word for writing and have used it for very long, it is not wise to design a new interface for writing and expect people to switch to it. Also it is difficult if not impossible to design a better interface than Word. Therefore this project will exclude the task of writing from its goals and focus on reading and organizing. The design will be based on the assumption that users use Microsoft Word or some other tools to write.



  • Read pdf files of books or articles.
  • Able to underline/highlight texts.
  • Able to take notes or write comments.

The reading experience will remain similar to a pdf reader such as Adobe Reader or Preview.


  • Select texts and highlight.
  • Input notes/comments



Quotes are conceptualized as objects that are independent of the sources they are from. They are more than just the highlighted texts. They contain the following information:

Quotes can be exported from the reading and displayed on an interface just for organizing. The user can read and organize quotes without going back to the source

Each quote contains a link to its source so that the user doesn't have to keep track of the source manually (writing down page number etc.). When the quote is clicked, it will open the source.

Organizing Quotes



Tags are used to categorize organize quotes into groups. Tags can be added to any quote as the user is reading. All quotes with the same tag will be put in the same group.

Tags can be added "on the go". When the user is reading, he/she can add tags to quotes without stopping to put a quote into a group each time. Quotes with tags can be organized later after the user finishes reading. This is designed to reduce interruptions during reading.


Groups are a data structure that resembles an array and contains a collection of quotes. Each group contains quotes that share certain traits such common tags, same source.

Three kinds of groups

Organizing Books/articles


  • A fileing system that organizes books, articles, files according to project.
  • Basic information such as author name, year, title needs to be displayed.
  • One piece of reading (book/article) can be used in different projects without creating multiple copies.

Library Manager

A concept of library has to be introduced to allow cross listing books in different projects without keeping duplicates.

A library contains a single copy of all readings. Readings can be grouped into different projects. One piece of reading can be added to multiple projects. These projects will contain links to this copy and only copy is kept.

All readings have to be imported to the library to be used in the application.


  • Import readings;
  • Remove readings;
  • Create projects;
  • Delete projects;
  • Add reading to projects
  • Remove reading from projects

Design the Interface

General Structure

The application contains 3 components, which will be explained in details.

Library Manager

Click to see Libary Manager in Action

One of the 3 major components of the application, Library Manager provides the function of organizing readings by books/articles. Here in the library, the user can view all of his/her readings in one place. Readings can be sorted and added to projects.

"Library" section in the middle of the interface has two parts: "In this project" and "More from the library".

"In this project" contains books/articles from the selected project on the left. In the wireframe below, project 1 is selected. There are four books in project 1.

"More from the library" contains books/articles NOT in the selected project. In the wireframe below, there are 7 books in "More from the library".

"In this project" and "More from the library" combined show all the readings in the library. No matter which project is selected, the user can always see all the books in the library. Adding books to a project is made easy with this design: simply drag a book up from "More from the library".

Importing to Library is made easy too. Dragging from "More from the computer" to either "In this project" or "More from the library" will import books to either the selected project, or the library (not in the selected project).


One of the 3 major components of the application, Reader is the interface that allows the user to read. Its design is modeled on Preview in MacOS.





One of the 3 major components of the application, Reader is the interface that allows the user to read. Its design is modeled on Preview in MacOS.

Limitations and Future Work

Library Manager

In Library manager, when a book/article is imported, its information needs to be parsed. For example, the title, author names, year need to be extracted from the file whatever the format it is (pdf, epub and etc.). The current design assumes that there is an algorithm that extracts this information while importing. However, if there is no such algorigthm, these info must be manually typed in and the current design lacks an interface for it.


Many details need to be further finalized in the workspace.

Lack of writing

there is no interface for the user to write. Writing needs to be integrated with the current design. One thing the writing interface must have is quote management. The link based notes will be carried to writing. Quotes can be easily embed in writing and link back to source. Rereferences should be automatically generated.


Pros of the current searching experience: cross source search, allows multiple searches shown at the same time, compare search results with other groups, don’t need to remember research results, Stop to do use usability because it has differed greatly from the usual searching experience, must have some user input to continue.


does not support graphs or images, or other form of media.

Hard copy books are not supported.

See prototype.