-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
174 lines (140 loc) · 17.3 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
<!DOCTYPE html>
<!-- saved from url=(0026)file:///D:/test.html#menu3 -->
<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="chrome=1">
<title>2014 Student Works</title>
<link rel="stylesheet" href="./2014 Student Works_files/bootstrap.min.css">
<!-- Use / before urls to access the main repo files, like stylesheets and js. -->
<link rel="stylesheet" href="./2014 Student Works_files/styles.css">
<link rel="stylesheet" href="./2014 Student Works_files/pygment_trac.css">
<link href="./2014 Student Works_files/lightbox.css" rel="stylesheet">
<script src="./2014 Student Works_files/jquery-1.11.0.min.js"></script>
<script src="./2014 Student Works_files/lightbox.min.js"></script>
<script src="./2014 Student Works_files/scale.fix.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<script src="./2014 Student Works_files/jquery.min.js"></script>
<script src="./2014 Student Works_files/bootstrap.min.js"></script>
</head>
<body>
<div class="wrapper">
<a id="home-link" href="http://info-design-lab.github.io/">
<header>
<h1 class="header">Information Design Lab</h1>
<p class="header">The digital presence of <nobr>Information Design Lab</nobr>, IDC, <nobr>IIT Bombay</nobr></p>
<!-- For a while, we don't need these button
<ul>
<li><a class="buttons github" href="https://github.com/info-design-lab">GitHub Profile</a></li>
</ul>
<!-- -->
</header></a>
<section>
<a id="top" class="anchor" href="http://info-design-lab.github.io/IDC-VDIS/#top" aria-hidden="true"><span class="octicon octicon-link"></span></a>
<h2>Visual Design for Interactive Systems</h2>
<p>Instructor: <strong>Prof. Venkatesh Rajamanickam</strong></p>
<p><strong> Course duration:</strong> 2weeks </p>
<p></p>
<p><strong>Course structure:</strong> <a href="http://info-design-lab.github.io/IDC-VDIS/files/IDC-VDIS%20structure.pdf"> VDIS course structure (PDF) </a></p>
<a id="info-viz-i-2013" class="anchor" href="http://info-design-lab.github.io/IDC-VDIS/#info-viz-i-2013" aria-hidden="true"><span class="octicon octicon-link"></span></a>
<a id="info-viz-ii-2014" class="anchor" href="http://info-design-lab.github.io/IDC-VDIS/#info-viz-ii-2014" aria-hidden="true"><span class="octicon octicon-link"></span></a>
<h3>Student Work (2014)</h3>
<div class="container" style="max-width:1000px; word-wrap:break-word;">
<ul class="nav nav-tabs">
<li class="active"><a data-toggle="tab" href="file:///D:/test.html#home" aria-expanded="true">Tanglible Data Representation</a></li>
<li class=""><a data-toggle="tab" href="file:///D:/test.html#menu1" aria-expanded="false">Infographics</a></li>
<li class=""><a data-toggle="tab" href="file:///D:/test.html#menu2" aria-expanded="false">Prototyping</a></li>
</ul>
<div class="tab-content">
<div id="home" class="tab-pane fade active in">
<p>The Assignment was to visualise any kind of data in 3 dimensional space which cannot be represented in 2D space.</p>
<ul>
<img src="./2014 Student Works_files/1 _ Physical Data Visualization _ S Nitin, Labeeba _ 146250003-page-001 (1).jpg" alt="Data Visualisation of Water" style="width:20%">
<img src="./2014 Student Works_files/Information Design - Rohan And Sandeep.jpg" alt="Data Visualisation of Best Buses" style="width:35%">
<img src="./2014 Student Works_files/Visualizing Rain intensity_Mumbai-page-001.jpg" alt="Data Visualisation of Best Buses" style="width:20%">
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%201/Akshay%20and%20Pankaj/Visualizing%20rain%20intensity%20in%20Mumbai/Visualizing%20Rain%20intensity_Mumbai.pdf">Visualising rain intensity in Mumbai</a> <em>by Akshay and Pankaj</em>
</li><li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%201/Ameya%20and%20sagar/Tea%20vs%20coffee%20at%20IDC,IITB/Data%20Visualisation_Poster.pdf">Visualising Tea and Coffee consumption in a day at IDC canteen</a> <em>by Ameya and Sagar</em>
</li><li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%201/Dileep%20and%20Neilmani/Air%20quality%20of%20metro%20cities%20in%20India/physical%20data%20visualization.pdf">Visualising quality of air of metro cities in India</a> <em>by Dileep and Neilmani</em>
</li><li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%201/Karan%20and%20Jayati/Number%20of%20calls%20incurred%20in%20a%20day/3d-visualization.pdf">Visualising number of calls incurred in a day</a> <em>by Jayati and Karan</em>
</li><li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%201/Naveen%20and%20Ravi/3D%20visualization%20of%20Dharma's%20activities/Project%20Dharma.pdf">Visualising Dharma's activities</a> <em>by Naveen and Ravi</em>
</li><li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%201/Nitin%20and%20Labeeba/Walk%20for%20water/1%20_%20Physical%20Data%20Visualization%20_%20S%20Nitin,%20Labeeba%20_%20146250003.pdf">Walk for water</a> <em>by Nitin and Labeeba</em>
</li><li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%201/Prasad%20and%20Indrajeet/Caffiene%20content%20in%20coffee/Poster%20for%20caffine%20content%20in%20coffee.pdf">Caffiene content in coffee</a> <em>by Prasad and Indrajeet</em>
</li><li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%201/Sandeep%20and%20Rohan/Best%20Bus%20service%20routes%20and%20frequency%20from%20IITB%20main%20gate/Information%20Design%20-%20Rohan%20And%20Sandeep.jpg">Best Bus service routes and frequency from IITB main gate</a> <em>by Rohan and Sandeep</em>
</li><li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%201/Shreshta%20and%20Dani/Guide%20to%20energy%20saving%20light%20bulb/Shreshta%20_%20Danny_146250010_3D%20visualization%20poster.pdf">Guide to energy saving light bulb</a> <em>by Shreshta and Dani</em>
</li><li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%201/Sitara%20and%20Rucha/Background%20of%20students%20at%20IDC%20since%20last%2011years/poster.pdf">Background of students at IDC since last 11years</a> <em>by Sitara and Rucha</em>
</li></ul>
</div>
<div id="menu1" class="tab-pane fade" >
<p>300 parties, 8000 candidates, 800 Million voters, 1 Million booths served by 20 Million officials. I with variety of structured & unstructured information –party performances, candidate histories, crime records, declared assets and historical trends. Identify narratives /aspects /issues that you want to explore and highlight through visualization of data from the general elections 2014. Gather and analyse relevant data to identify a data set with the greatest potential for an unique, surprising or hitherto unavailable point of view. Parse, filter, represent and refine to create a static visualization.</p>
<ul>
<img src="./2014 Student Works_files/GE2014_Ink_Infographic-page-001.jpg" alt="Data Visualisation of Best Buses" style="width:25%">
<img src="./2014 Student Works_files/Infographic-page-001.jpg" alt="Data Visualisation of Best Buses" style="width:25%">
<img src="./2014 Student Works_files/Shreshta_1462250010_Indian Elections Infographic-page-001.jpg" alt="Data Visualisation of Best Buses" style="width:25%">
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%202/Akshay_number%20of%20people%20who%20opted%20fo%20NOTA/Data%20visualization_NOTA.pdf">Number of people who opted fo NOTA</a><em> by Akshay</em></li>
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%202/Ameya_The%20Black%20ink%20of%20democracy/GE2014_Ink_Infographic.pdf">The Black ink of democracy</a><em> by Ameya</em></li>
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%202/Dani_Time%20for%20womens'%20reservation%20bill/Infographics.pdf">Time for womens' reservation bill</a><em> by Dani</em></li>
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%202/Dileep_social%20media%20campaigns%20in%20general%20elections/Infographic.pdf">Social media campaigns in general elections</a><em> by Dileep</em></li>
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%202/Indrajeet_elections%20in%20Guwahati/Infographic%20of%20ELECTIONS%20IN%20GHY-.pdf">Elections in Guwahati</a><em> by Indrajeet</em></li>
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%202/Jayati_Expenditure%20during%20elections/infographics.pdf">Expenditure during General Elections 2014</a><em> by Jayati</em></li>
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%202/Karan_How%20India's%20north%20east%20voted/How%20India's%20North%20East%20voted.pdf">How India's North East voted</a><em> by Karan </em></li>
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%202/Labeeba_Role%20of%20model%20code%20of%20conduct%20teams/1.pdf">Role of model code of conduct teams</a><em> by Labeeba</em></li>
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%202/Naveen_Uttarakhand%20general%20elections/InfographicUttarakhandElections.pdf">Uttarakhand general elections</a><em> by Naveen</em></li>
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%202/Neilmani_Jharkhand%20on%20the%20mind/data%20visualization.pdf">Jharkhand on the mind</a><em> by Neilmani</em></li>
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%202/Nitin_voters%20guide%20to%20elections/2%20_%20Election%20Infographic%20_%20S%20Nitin%20_%20146250003.png">Voter's guide to elections</a><em> by Nitin</em></li>
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%202/Pankaj_Election%20spend%20over%20years/Final%20poster.pdf">Election spend over years</a><em> by Pankaj</em></li>
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%202/Prasad_Criminal%20records%20of%20MPs/VDIS%20Infographic.pdf">Criminal records of MPs</a><em> by Prasad</em></li>
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%202/Ravi_Why%20can't%20one%20ignore%20UP%20in%20elections/Data%20Visualisation%20UP-01.jpg">Why can't one ignore UP in elections</a><em> by Ravi</em></li>
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%202/Rohan_Voter%20turnout%20in%20India/Infographic_RohanVerma.pdf">Voter turnout in India</a><em> by Rohan</em></li>
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%202/Rucha_Thane%20Parliamentary%20constituency%20in%202009%20&%202014/2_Election%20infographic.jpg">Thane Parliamentary constituency in 2009 & 2014</a><em> by Rucha</em></li>
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%202/Sagar_Gerontocracy%20in%20Democracy/infographics.pdf">Gerontocracy in Democracy</a><em> by Sagar</em></li>
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%202/Sandeep_Popular%20names%20in%20elections/Election%20Visual2.pdf">Popular names in elections</a><em> by Sandeep</em></li>
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%202/Shreshta_Death%20of%20secular%20democracy/Shreshta_1462250010_Indian%20Elections%20Infographic.pdf">Death of secular democracy</a><em> by Shreshta</em></li>
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%202/SItara_criminal%20records%20of%20candidates/infographic.pdf">Criminal records of candidates</a><em> by Sitara</em></li>
</ul>
</div>
<div id="menu2" class="tab-pane fade">
<p>The assignment was designed to go through the entire process of mobile application development. The development process included designing information architecture, wireframing, low fidelity prototypes, high fidelity prototypes and the final application screens.</p>
<ul>
<img src="./2014 Student Works_files/2.jpg" alt="Data Visualisation of Best Buses" style="width:25%">
<img src="./2014 Student Works_files/3 _ UnHack App Documentation _ S Nitin _ 146250003pdf-page-013.jpg" alt="Data Visualisation of Best Buses" style="width:35%">
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%203/Akshay/Akshay_UnHack.pdf">Design document by Akshay</a></li>
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%203/Ameya/UnHack.pdf">Design document by Ameya</a></li>
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%203/Dani/Castle_rock.pdf">Design document by Dani</a></li>
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%203/Dileep/Unhack.pdf">Design document by Dileep</a></li>
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%203/Indrajeet/Unhac%20Document.pdf">Design document by Indrajeet</a></li>
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%203/Jayati/unHack.pdf">Design document by Jayati</a></li>
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%203/Karan/UnhackDocumentation.pdf">Design document by Karan</a></li>
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%203/Labeeba/unHACK%20booklet.pdf">Design document by Labeeba</a></li>
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%203/Naveen/UnhackConceptNaveenRawat_146330011.pdf">Design document by Naveen</a></li>
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%203/Neilmani/unhack%20documentation.pdf">Design document by Neilmani</a></li>
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%203/Nitin/3%20_%20UnHack%20App%20Documentation%20_%20S%20Nitin%20_%20146250003pdf.pdf">Design document by Nitin</a></li>
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%203/Pankaj/Documentation%20unHACK.pdf">Design document by Pankaj</a></li>
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%203/Prasad/Final_document_VDIS.pdf">Design document by Prasad</a></li>
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%203/Ravi/Layout%2002.pdf">Design document by Ravi</a></li>
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%203/Rohan/Unhack%20Redesign_Rohan%20Verma.pdf">Design document by Rohan</a></li>
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%203/Rucha/3_Unhack%20App.pdf">Design document by Rucha</a></li>
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%203/Sagar/app.pdf">Design document by Sagar</a></li>
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%203/Sandeep/UnhackUI.pdf">Design document by Sandeep</a></li>
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%203/Shreshta/Shreshta_146250010_Unhack%20Book.pdf">Design document by Shreshta</a></li>
<li><a href="http://info-design-lab.github.io/IDC-VDIS/Assignment%203/Sitara/Flowchart%20+%20GUI%20.pdf">Design document by Sitara</a></li>
</ul>
</div>
<!-- <a href="img/demopage/image-1.jpg" data-lightbox="roadtrip" data-title="My caption">Image #1</a>
<a href="img/demopage/image-2.jpg" data-lightbox="roadtrip"></a>
<a href="img/demopage/image-3.jpg" data-lightbox="roadtrip"></a>
<a href="img/demopage/image-4.jpg" data-lightbox="roadtrip"></a>
-->
<a id="contact" class="anchor" href="http://info-design-lab.github.io/IDC-VDIS/#contact" aria-hidden="false"><span class="octicon octicon-link"></span></a>
<h3>Contact</h3>
<p>
You can reach Prof. Venkatesh Rajamanickam <a href="mailto:venkatra@iitb.ac.in">via email</a>
</p>
</section>
<footer>
<p><small>Powered by <a href="http://pages.github.com/">GitHub</a> <a href="https://github.com/info-design-lab/ID405-HCIDesign">Link to Github Repo</a></small></p>
</footer>
</div>
<!--[if !IE]><script>fixScale(document);</script><![endif]-->
<div id="lightboxOverlay" class="lightboxOverlay" style="display: none;"></div><div id="lightbox" class="lightbox" style="display: none;"><div class="lb-outerContainer"><div class="lb-container"><img class="lb-image" src=""><div class="lb-nav"><a class="lb-prev" href=""></a><a class="lb-next" href=""></a></div><div class="lb-loader"><a class="lb-cancel"></a></div></div></div><div class="lb-dataContainer"><div class="lb-data"><div class="lb-details"><span class="lb-caption"></span><span class="lb-number"></span></div><div class="lb-closeContainer"><a class="lb-close"></a></div></div></div></div><div id="lightboxOverlay" class="lightboxOverlay"></div><div id="lightbox" class="lightbox"><div class="lb-outerContainer"><div class="lb-container"><img class="lb-image" src=""><div class="lb-nav"><a class="lb-prev" href=""></a><a class="lb-next" href=""></a></div><div class="lb-loader"><a class="lb-cancel"></a></div></div></div><div class="lb-dataContainer"><div class="lb-data"><div class="lb-details"><span class="lb-caption"></span><span class="lb-number"></span></div><div class="lb-closeContainer"><a class="lb-close"></a></div></div></div></div></body></html>