Loren Colcol — Infrastructure Resource Assistant | VR Developer based in San Francisco Bay Area, CA

Vizir Data Analytics (Web App)

Data Visuals

vizir.co/#/en/

Vizir is a web app for surveys and questionnaires created by French startup, Vizir. For free, users can create a survey, select the type of questions and share their surveys with whoever through a link. I was part of creating the data visualizations for the analytics page, which takes all the data from survey information stored in JSON files in our database, and processing that data into various data visuals like bar charts, pie charts, and histograms.

ForVizir RoleWeb Developer
DateJuly 2015 SoftwarePixelmator • Sublime Text 2 • Git
Implementation ToolsGit • JavaScript • HTML/CSS • NodeJS

Mobile app concept for the analytics page. I kept the same core elements but resized them appropriately to be responsive on a mobile web browser.

As a web developer for Vizir, I was tasked with creating data visuals for their analytics web page. The process encompassed 4 phases:
1. Research data visual libraries and tools.
2. Mock concepts for data visual choices for various data (eg. pie chart vs. bar chart for numbers).
3. Develop data visuals with HTML, CSS, and Javascript.
4. Test data visuals as a prototype.

There were several elements in creating the concept mock ups of the data visuals: UI design, color scheme/themes, size and proportions, and text/font choices. Part of this process as a web developer had my brain rethinking how I looked at other websites and how they approached UI design. I wanted to keep the design minimal and simple, while also easy on the eyes.

A feature I was tasked with was presenting the actual numerical data in tables. We came up with a feature of clicking the visual which would trigger it to flip over and present the data in table format. This was important as data, when presented in 2 different mediums to a user (visual graphic vs. table), it is processed differently, so having both accessible was essential.

Some unique challenges I faced during the project were learning French to better communicate with my co-workers, learning to develop web apps and utilize data visualization libraries, working within the MVC framework of Model-View-Controller, to interact various parts of the web app (ie. linking/parsing JSON data in the database to update to data visuals), and lastly understanding statistical math to compute the correct outputs from JSON information to a data visual.

FInal product.