-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
147 lines (143 loc) · 9.82 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
<!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">
<link rel="icon" href="img/favicon.png" type="image/png">
<title>Fawaz Dinnunhan</title>
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="vendors/linericon/style.css">
<link rel="stylesheet" href="css/font-awesome.min.css">
<link rel="stylesheet" href="vendors/owl-carousel/owl.carousel.min.css">
<link rel="stylesheet" href="vendors/lightbox/simpleLightbox.css">
<link rel="stylesheet" href="vendors/nice-select/css/nice-select.css">
<link rel="stylesheet" href="vendors/animate-css/animate.css">
<link rel="stylesheet" href="vendors/popup/magnific-popup.css">
<link rel="stylesheet" href="vendors/flaticon/flaticon.css">
<!-- main css -->
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/responsive.css">
</head>
<body>
<!--================Home Banner Area =================-->
<section class="home_banner_area">
<div class="container box_1620">
<div class="banner_inner d-flex align-items-center">
<div class="banner_content">
<div class="media">
<div class="d-flex">
<img src="img/personal.jpg" alt="">
</div>
<div class="media-body">
<div class="personal_text">
<h6>Hello Everybody, i am</h6>
<h3>Fawaz Dinnunhan</h3>
<p>I am a near-graduate in Bachelors of IT at Otago Polytechnic, pursuing a developer role at a friendly and motivated company.</p>
<ul class="list personal_social">
<li class="cvli"><a href="cv/Fawaz-Dinnunhan-CV.pdf" download target=”_blank”><i class="CV">CV</i></a></li>
<li><a href="https://github.com/fawazd" target=”_blank”><i class="fa fa-github"></i></a></li>
<li><a href="https://www.linkedin.com/in/fawazd/" target=”_blank”><i class="fa fa-linkedin"></i></a></li>
<li><a href="mailto:[email protected]" target=”_blank”><i class="fa fa-envelope"></i></a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!--================End Home Banner Area =================-->
<!--================Feature Area =================-->
<section class="feature_area p_120">
<div class="container">
<div class="main_title">
<h2>PORTFOLIO</h2>
</div>
<div class="feature_inner row">
<div class="col-lg-4 col-md-6">
<div class="feature_item">
<img src="img/unity.png" alt="unity icon" title="Unity">
<img src="img/tobii.png" alt="tobii icon" title="Tobii">
<h3>Stroke Visual Rehabilitation - 3D Pong</h3>
<p>The focus of this project is to apply visual rehabilitation methods for stroke victims with impaired eyesight. The rehab method that is applied slowly trains the patients eyes to look towards their visually impaired side as they follow the ball around the screen. Using Unity, C# Scripts and Tobii's Eye Tracker & SDK, I have recreated the classic arcade game Pong in a re-imagined 3D format. The added twist of the game is to control the paddle using your eyes.</p>
<div class="btnCol">
<a href="https://www.youtube.com/watch?v=944efAsAIxo" target="_blank" class="btn submit_btn">Preview</a>
<a href="https://github.com/fawazd/3D-Pong-With-Eye-Tracking" target="_blank" class="btn submit_btn">Source</a>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div class="feature_item">
<img src="img/django.png" alt="django icon" title="Django">
<img src="img/mysql.png" alt="mysql icon" title="MySQL">
<img src="img/bootstrap.png" alt="bootstrap icon" title="Bootstrap">
<img src="img/opentdb.png" alt="open-trivia-database icon" title="Open Trivia Database">
<h3>Open Trivia Quiz Tournament</h3>
<p>This dynamic web application hosts trivia quiz games, that allows for the creation and participation of tournaments. Developed using Django, MySQL and the Open Trivia Database RESTful API. Includes robust functionality, MVC architecture and automated testing.</p>
<p>An admin user is able to create tournaments with basic information such as name, start and end dates, advanced settings include various categories and difficulties to select from. When a user logs in, they are displayed a list of active and upcoming tournaments in which they can participate. Their scores are recorded and displayed at the end. Additionally, displays a list of users with high scores for past tournaments.</p>
<div class="btnCol">
<a href="https://github.com/fawazd/Open-Trivia-Quiz" target="_blank" class="btn submit_btn">Source</a>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div class="feature_item">
<img src="img/asp.png" alt="asp.net mvc icon" title="ASP.NET MVC">
<img src="img/sql-server.png" alt="sql server icon" title="SQL Server">
<h3>SMMC Database</h3>
<p>Built with ASP.NET MVC and SQL Server, this fully functional database application has a well designed web interface for music schools that will allow for easy management of staff, students, instruments, lessons, ensembles and performances.</p>
<p>My primarily role in this project revolved around the construction of the data model along with my colleague. We had both split the work equally as we both wanted to learn and experience every part of the process. From data model design, normalizing, triggers, complex procedures and the creation of the web app using the mcv arhictecture</p>
<div class="btnCol">
<a href="https://github.com/fawazd/SMMC-Database" target="_blank" class="btn submit_btn">Source</a>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div class="feature_item">
<img src="img/django.png" alt="django icon" title="Django">
<img src="img/postgresql.png" alt="postgresql icon" title="PostgreSQL">
<img src="img/bootstrap.png" alt="bootstrap icon" title="Bootstrap">
<h3>Viewpoint Diversity App</h3>
<p>VDA is a dynamic quiz web application, a recreation of the OpenMind quiz which focuses on helping people learn and develop skills that will allow them to work together and coexist with others that have differing opinions in life. This web application was created using Django, PostgreSQL and Bootstrap.</p>
<p>The biggest obstacle we faced was figuring out the complex data model that the OpenMind team had implemented on their application. It took many iteration of changing our data model to reach a suitable final design that allowed the variety of functionality to coexist. My role in this project was coding the functionality of the quiz, primarily the Quiz and Progress views. Due to the process we had gone through in deciphering the database model my skills in deconstructing and understanding existing database designs has grown a lot.</p>
<div class="btnCol">
<a href="https://github.com/fawazd/Viewpoint-Diversity-App" target="_blank" class="btn submit_btn">Source</a>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div class="feature_item">
<img src="img/scrapy.png" alt="scrapy icon" title="Scrapy">
<h3>Media Analytics</h3>
<p>A web application that allows anyone to query a large corpus of journalistic data using natural language processing tools. My role in this project revolved around collection of data, specifically articles from the New York Times archive. The NLP model needed to support frequency of word usage over the last 100+ years, which requires the collection of millions of articles. To accomplish this, I learned how to use the Scrapy web crawling framework thoroughly and created a Spider which was able to crawl through the NYT archive and scrape the necessary data from the appropriate links. I am currently in charge of maintaining the website, adding new features/language models and working on a new design for the web app.</p>
<div class="btnCol">
<a href="https://media-analytics.op-bit.nz" target="_blank" class="btn submit_btn">Preview</a>
<a href="https://github.com/fawazd/NYT-Crawler" target="_blank" class="btn submit_btn">Source</a>
</div>
</div>
</div>
</div>
</div>
</section>
<!--================End Feature Area =================-->
<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="js/jquery-3.3.1.min.js"></script>
<script src="js/popper.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/stellar.js"></script>
<script src="vendors/lightbox/simpleLightbox.min.js"></script>
<script src="vendors/nice-select/js/jquery.nice-select.min.js"></script>
<script src="vendors/isotope/imagesloaded.pkgd.min.js"></script>
<script src="vendors/isotope/isotope.pkgd.min.js"></script>
<script src="vendors/owl-carousel/owl.carousel.min.js"></script>
<script src="vendors/popup/jquery.magnific-popup.min.js"></script>
<script src="js/jquery.ajaxchimp.min.js"></script>
<script src="vendors/counter-up/jquery.waypoints.min.js"></script>
<script src="vendors/counter-up/jquery.counterup.min.js"></script>
<script src="js/mail-script.js"></script>
<script src="js/theme.js"></script>
</body>
</html>