Scribd
Upload
40 views11 pages

Portfolio - Web Metrics Report

This document summarizes a metrics report webpage project that displays analytics for an event photo printing service. The project retrieves data from databases on photos printed through Instagram and a webapp, as well as engagements on Facebook and Twitter. Charts show the number of users, photos printed, and other metrics over time. Users can search for events, filter data by date range, and sort lists. The developer is responsible for retrieving data, performing statistical analysis, and displaying results through charts and lists using technologies like JavaScript, Node.js, MongoDB, and Heroku. Due to company policies, source code cannot be shared.

Uploaded by

Tu Nguyen
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
40 views11 pages

Portfolio - Web Metrics Report

This document summarizes a metrics report webpage project that displays analytics for an event photo printing service. The project retrieves data from databases on photos printed through Instagram and a webapp, as well as engagements on Facebook and Twitter. Charts show the number of users, photos printed, and other metrics over time. Users can search for events, filter data by date range, and sort lists. The developer is responsible for retrieving data, performing statistical analysis, and displaying results through charts and lists using technologies like JavaScript, Node.js, MongoDB, and Heroku. Due to company policies, source code cannot be shared.

Uploaded by

Tu Nguyen
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 11

Metrics Report Webpage

Company Instaroid Singapore

Authors Ulrich van Brakel


Célia Fauchier
Nguyen Viet Tu

Description The Metrics Report Webpage shows the charts of number of users and
photos printed through Instagram and Webapp and other datas got
from Facebook and Twitter.

My Position Developer

My Responsibility Get data from database, doing statistical algorithms, and represent
results on charts.
Add function sorting

Technologies used Javascript, Node JS, HTML, CSS


Angular JS, MongoDB, MySQL
Keen API to manage database
Heroku to deploy app

Git Link This project is one of my project in old company. Due to company
security policies, I can’t provide you source code. I apologize for that,
however, I am willing to answer any question about related
technologies and knowledge.
1. Problem Definition - The Object of the Project
• During event, people can print their own photos using 2 method:
- Open webapp through URL, login to their Facebook account and upload photos
on web. People can gain more credits to print more photos by like/share company
Facebook/Twitter page.
- Upload their photos on their public Instagram profile, with correct hashtag.
• After event, client would like to have the metrics report, which shows them the number of
users and photos were printed, also the number of likes, shares, comments, impressions,
unique emails of users that they received during event.
• This project to get all required data and represent them on charts.

2. Customer Specification - Functional Requirements


Following is a list of functionalities of the system. More functionalities that you find
appropriate can be added to this list.
• User must have a valid Username and password to login to the website.
• After the valid user logs in:
- He can type a keyword in searching bar to find event name.
- List of suggested event name is dropped down while he is typing.
- He can choose the timerange on calendar.
• After searching for event name in selected timerange, he is shown:
- Combined charts of number of users and photos gotten through Instagram and
Webapp.
- Toggle to show/hide Instagram or Webapp data on charts.
- Charts of data gotten throught Instagram and Facebook and Twitter.
- List top posts, top publishers and top hashtag.
- Icon button to sort lists by number of likes, comments, posts or impressions.
• Print button to export report files.
3. User Interface
a. Login Page

Name Type Event Validation Description Status


Username TextBox String, not null Input User’s name

Password TextBox String, not null Input User’s password

Login Button Click Login


b. Main Screen
c. Search Event

Name Type Event Validation Description Status


TextBox String, not null Input Event Name

Ok Button Click Search Event

d. Choose Timerange

Name Type Event Validation Description Status


Datepicker Choose Choose Timerange
e. Print

Name Type Event Validation Description Status


Print Button Click Export Report file

f. Chart

Name Type Event Validation Description Status


Number of Chart Hover Display detailed
prints/users per day data
Webapp/Instagram Button Click Show/Hide
corresponding data
g. Chart after clicking toggle button

h. Other data from Instagram and Facebook


i. Top posts, publishers and hashtags

j. Top posts
Name Type Event Validation Description Status
Likes Button Click Sort lists by
number of likes
Comments Button Click Sort lists by
number of
comments

k. Top posts sorted by Comments


l. Top publishers

Name Type Event Validation Description Status


Posts Button Click Sort lists by number
of posts
Likes Button Click Sort lists by number
of likes
Impressions Button Click Sort lists by number
of impressions
4. Project Structure

You might also like