Venn Project

From Protein Prediction 2 Winter Semester 2014
Revision as of 11:00, 20 November 2014 by Ppwikiuser (talk | contribs) (Project Roadmap)

This project is Venn diagrams visualization tool development to display list comparison for showing and visualizing gene list differences and relations. The development plans to use a JavaScript library d3js and other important tools/frameworks. It also takes into consideration various other open source Venn diagram projects as code base or experience assessments. One of this projects recommended by our mentors is the jvenn project.

Features and Mockups

The project plans to provide important features and functionalities to enable users interested in gene list comparison and visualization with clear set of requirements possible. The following sections list and illustrate (with mockups and use cases) important user experience (visuals, information structure, and interaction), functionalities and features of the project work.

User Experience (UXD)

The project aims to provide a single page application structure, high interaction, better data input and output support, and better data visualization for a good user experience and satisfaction possible.

The work plans to understand users’ value for accessibility and list comparison requirements to achieve good usability. It aims to maintain as well clear visual interaction possible by a minimum sets of simple and less loaded page.

Visuals and Interaction

venn.project mockup

Information Structure (data, presentation...)

venn.project arch


  • Program takes the lists as input. Normally having the same characteristic, the items on the same list are put in the one set.
  • Find out the elements which are in the intersection of sets.
  • The Venn diagram with at most 6 different groups.
  • Can highlight a specific set. Show all the elements in the highlighted group.
  • Calculate area of the set (including overlapping area). The group which has more elements should occupy more area.
  • Show and hide specific set in Venn diagram.
  • Save the result diagram as image file.


  • Take input with different format. Beside read the input form user interface, the program can be fed with file. So far CVS and JSON are on the top of the list. This feature is useful when the input data is huge.
  • Searching the element
  • Represent the classic Venn diagram. Maybe Edwards’ also if we have the time.

  • Can use bar chart as supporting graph.
  • Customize diagram color.
  • May have a 3D Venn diagram. However, this may not be a good idea in some cases. For example, spheres Venn diagram may be a bad visualization way when there are too many sets.

Application Design/Tools and Technologies

Expected Technical Challenges

Creating circles having the ability to adapt and change in shape with respect to lists size and intersections between them. Specially when complexity increases.

Project Roadmap

  • 27/11 Can show circles with different size according to number of element contain without overlapping. Find out the element in the same group.
  • 04/12 At least can show 4 different groups properly in one Venn diagram with overlapping, start working on a simple GUI
  • 11/12 Start working on file parser. Working on interactive visualization, for example, highlighting the specific set.
  • 17/12 The basic Venn diagram should be finished. Start to work on different mode. (Edwards’) Adding the supporting bar chart.
  • 24/12 Customize color. Show and hiding specific set. Start working on more impress effect. (3D Venn diagram)
  • 1/1 Review and documentation
  • 8/1 Submit