-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindexTBW.html
89 lines (80 loc) · 4.22 KB
/
indexTBW.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
<!DOCTYPE html>
<html>
<head>
<title>M-#TrustBlackWomen</title>
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
<body id="full" >
<div id="wrapper">
<div id="nav"><a href="index.html"><img src="images/logo.png" width="150px" height="90px" alt="logo" class="logo"></a>
<ul>
<li class="home"><a href="index.html">Home</a></li>
<li class="about"><a href="about.html">About</a></li>
</ul>
</div>
<div id="container-work">
<div class="project-head">
<div class="Eboxin">
<img src="images/doublec.png" width="70%">
<p class="breakdown">
<strong>Role</strong>
: Web Design, User Interface Design, Wireframing,<br>
<strong>Tools Used</strong>: Adobe Illustrator,
</p>
<div class="zoom"
<div class="Eboxin-info">
<h1 class="headerT2">#TrustBlackWomen</h1>
<h3> I create a website and did brand design for the initiative #TrustBlackWomen. </h3>
</div>
</div>
</div>
<div class="project-container">
<div class="project-description">
<h1 class="ProjC">Context</h1>
<div class="Epara">
<p> This initiative was created by SisterSong. During Summer 2018 I was accepted as a design fellow for the MS.Foundation. They paired me up with the non profit, SisterSong. SisterSongis a women of color Reproductive Justive Collective that was formed in 1997 by 16 organizationa of women of color.
</p>
</div>
</div>
<div class="project-description">
<h1 class="ProjC">Research</h1>
<div class="Epara">
<p> SisterSong is a Southern based, national membership organization; with a purpose to build an effective network of individuals and organizations to improve institutional policies and systems that impact the reproductive lives of marginalized communities.
<br><br>
So, I did 2 site visits throughout the summer that exposed me to the passion, dedication, and hard work that goes into being a leading organization in reproductive justice movement for women of color.</p>
<img src="images/dcresearch.png" width="70%">
</div>
</div>
<div class="project-description">
<h1 class="ProjC">Ideation</h1>
<div class="Epara">
<p> I started with wanting to creating a VR experience that shows the different angles of a protest, in order to show how a black individual living in America needs to understand how other might perceive them. Having it be a VR experience would make people feel the anxiety, fear, confusion, and assumption made on both sides of a protest.
<br><br>
With feedback that, idea crashed and burned. Then finding solace in my Fine Arts and Art History background, I thought to turn this into an installation.
<br><br>
With the installation idea, I new I wanted to implement mirrors because mirrors are an object that show you who you are without judgement. </p>
<img src="images/dcsketches1.4.png" width="70%">
<img src="images/dcsketches2.png" width="70%">
<p>
I then went on to prototype the technology side of the experience. Knowing that I wanted a surveillance piece to this installation I started working with: ml5, javascript, Openframeworks, Unity.
</p>
<img src="images/dctech.png" width="70%">
</div>
</div>
<div class="project-description">
<h1 class="ProjC">User Testing</h1>
<div class="Epara">
<p>
<strong>Step one:</strong> you first aproach the mirrors on the wall and look at yourself.
<br><br>
<strong>Step two:</strong> you then go behind the monitor and place your hands in front of the camera. The screen in front of you asks the question, "Living in America is my life in danger?"
<br><br>
<strong>Step thee:</strong> Once the surveillance system collects and determines the result of your skin color, the screen will then navigate you to a web page that proves why you are either, 'Unsafe' | 'Good to Stay' | 'Nah Your Safe' | through data.
</p>
<img src="images/dcproto4.png" width="70%">
<img src="images/dcusertest.png" width="70%">
</div>
</div>
</body>
</html>