<?php
session_start();
if (!isset($_SESSION['portfolio_auth'])) {
    header('Location: /enter.php?redirect=' . urlencode($_SERVER['REQUEST_URI']));
    exit;
}
?>
<!DOCTYPE html>
<html lang="en">
	<head>
	    <!-- Required meta tags -->
	    <meta charset="utf-8">
	    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

	    <!-- Custom CSS -->
	    <link href="styles/style-projects.css" rel="stylesheet" type="text/css">

	    <title>OnYou Kang</title>
	</head>

	<body>
		<div class="my-container project-page where-are-you-from">
			<div class="content">
			    <div class="intro">
					<div class="intro-image">
						<img src="images/where-are-you-from-top.png" alt="Where Are You From? project">
					</div>
					<div class="intro-text">
						<p class="title">Where Are You From?</p>
						<a target="_blank" href="https://onyoukang.github.io/nln2018/rooms-hallways-copy/index.html"><p class="mockup-button">View Website</p></a>
					</div>
				</div>
				<div class="intro-meta">
					<p class="subtitle">Where Are You From? is a web-based interactive project inspired by <a class="articles" href="https://www.nbcnews.com/news/us-news/trump-s-history-breaking-decorum-remarks-race-ethnicity-n837181" target="_blank">an article</a> about Donald Trump asking a career intelligence analyst where "your people" are from.</p>
					<p class="roles">User Research | Wireframing | Prototyping</p>
				</div>

			    <div class="main">
			    	<p class="heading2">Objective</p>
			    	<p class="heading3-bottom">Where Are You From? is a non-linear web-based experience where the users are given two options to choose from and have to choose the "right" option in order to get out of the loop. I think it is better not to reveal the way out for you, as a first-time user, to have a raw experience and take away what I wished users would. </p>

			    	<p class="heading2">Research</p>
			    	<p class="heading3">The career intelligence analyst with expertise in hostage policy was an Asian-American woman born in Manhattan, New York City. </p>
			    	<p class="heading3-bottom">So, when she was initially asked where she was from, she replied "New York". Yet, the president was not satisfied and wanted to know where "your people" are from. And when she said that her parents are Korean, he asked why the "pretty Korean lady" isn't negotiating with North Korea. </p>

			    	<div class="img-container">
				    	<img class="img-inline img-left outline" src="images/where-are-you-from-progress.jpg" data-group="process" loading="lazy">
			    	</div>

				    <p class="heading3-bottom">"Where are you really from?" is so ludicrous a question to be asked in the 21st century that there is even a comedy skit on it. It is embarrassing that the president of a country asked such a question. Sadly, however, it is certainly not a rare experience for people of color to be asked where they are "really from".</p>

				    <p class="heading2" id="myDiv">Final Product</p>
				    <a target="_blank" href="https://onyoukang.github.io/nln2018/rooms-hallways-copy/index.html"><p class="mockup-button-2">View Website</p></a>
				    <img class="xl-image border" src="images/where-are-you-from-1.png" data-group="final" loading="lazy">
				    <img class="one-third margin-right border" src="images/where-are-you-from-2.png" data-group="final" loading="lazy">
				    <img class="one-third margin-right border" src="images/where-are-you-from-3.png" data-group="final" loading="lazy">
				    <img class="one-third border" src="images/where-are-you-from-4.png" data-group="final" loading="lazy">
			    </div>

			</div>

			<div class="next-project">
				<p class="next">Next Project:</p>
				<p class="next-bold">classic.</p>
				<a href="classic.php"><img class="next-img" src="images/next-classic.jpg"></a>

				<a href="for-those-who-are-color-blind.php"><img class="arrow-left" src="images/w-arrow-left.png"></a>
				<a href="for-those-who-are-color-blind.php"><p class="previous">Previous</p></a>
			    <a href="classic.php"><img class="arrow-right" src="images/w-arrow-right.png"></a>
			</div>

		</div>

	    <script src="scripts/nav.js"></script>
	    <script src="scripts/lightbox.js"></script>

	</body>
</html>
