-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
143 lines (140 loc) · 7.35 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<title>Megan Moulos - Personal Website</title>
</head>
<body>
<script src="script.js"></script>
<header>
<nav>
<div id="nav_left">
<a href="">Megan Moulos</a>
</div>
<div id="nav_right">
<a href="#about_section">About</a>
<a href="#experience_section">Experience</a>
<a href="#recent_projects_section">Portfolio</a>
<a href="#contact_section">Contact</a>
</div>
</nav>
</header>
<div id="hero">
<div id="hero_left">
<img src="images/meg_hero.png" alt="photo of Megan" id="hero_image">
</div>
<div id="hero_right">
<h1>Megan Moulos</h1>
<h2>Software Engineer & UI Designer</h2>
<p id="hero_p">I'm a <b>full-stack software engineer</b> and <b>UI designer</b> living and working in Seattle. I have previously worked in UX and graphic design.</p>
<button id="contact">Contact Me</button>
<div>
<img src="images/github_icon.png" class="icon" alt="github icon">
<img src="images/linkedin_icon.png" class="icon" alt="linkedin icon">
<img src="images/instagram_icon.png" class="icon" alt="instagram icon">
</div>
</div>
</div>
<div id="about_section">
<div id="about_left">
<h3>About Me</h3>
<p>I love creating online experiences that are user-focused. My interest in web design began back in the Myspace era, fiddling with HTML to make my personal site shine. Now I am a <b>full-stack engineer</b> and <b>UI designer</b> with experience in UX research and testing. </p>
<p>I spend a lot of time with my two dogs and my lovely partner. I enjoy knitting, fostering animals, and paddleboarding in my free time.</p>
<p>Currently using: <b>JavaScript</b>, <b>HTML</b> and <b>CSS</b></p>
</div>
<img src="images/medogs_1.png" alt="Megan and her dogs" id="about_img">
</div>
<div id="experience_section">
<div id="experience_left">
<h3 class="experience_head">Experience</h3>
<div>
<div class="vl"></div>
<div class="experience_chunk">
<h4>Freelance Artist</h4>
<p class="date">2019 - 2022</p>
<p>Produced artwork in traditional and digital media. See my personal portfolio here!</p>
</div>
<div class="experience_chunk">
<h4>Senior Graphic Designer</h4>
<p class="date">2019</p>
<p>UI, UX, and graphic design on a number of projects for Taxfyle. Lead graphic designer for the company and handle everything from print advertising to fully fledged web design projects. Worked directly with the development team to ensure success and quick iteration. Managed a junior designer and a social media marketer. Programs used daily: Adobe XD, Illustrator, Photoshop. </p>
</div>
<div class="experience_chunk">
<h4>Freelance UI/UX and Graphic Design</h4>
<p class="date">2015 - 2019</p>
<p>I worked with traditional and digital media to create fine art for sale or by commission, as well as freelance and contract work creating logo designs and custom typography. I created websites, UI elements, and apps from the idea stage to complete, pixel-perfect designs. I also created traditional art including paintings, sketches, sculpture, and textiles. </p>
</div>
</div>
</div>
<div id="experience_half">
<h3 class="experience_head">Education</h3>
<div class="vl"></div>
<div class="experience_chunk">
<h4>Flatiron School</h4>
<p class="date">2022</p>
<p>Software Engineering track</p>
</div>
<div class="experience_chunk">
<h4>Florida State University</h4>
<p class="date">2015</p>
<p>Master's Degree in Classical Archaeology</p>
<p class="date">2013</p>
<p>Bachelor's Degree in Classical Archaeology</p>
</div>
<div class="experience_chunk">
<h4>Florida Atlantic University</h4>
<p class="date">2007</p>
<p>Dual BA in History and Art History</p>
</div>
<button>Download Resume</button>
</div>
</div>
<div id="recent_projects_section">
<h3>Recent Projects</h3>
<div class="cards">
<div class="card">
<img src="images/mymuseumpage.png" alt="MyMuseum homepage">
<p class="card_heading">MyMuseum</p>
<p class="card_info">Card Info</p>
</div>
<div class="card">
<img src="images/landingpage.png" alt="minimaList landing page">
<p class="card_heading">minimaLIST</p>
<p class="card_info">Card Info</p>
</div>
<div class="card">
<img src="images/fashionatelanding.png" alt="Fashionate landing page">
<p class="card_heading">Fashionate Landing Page</p>
<p class="card_info">Card Info</p>
</div>
<div class="card">
<img src="images/fashionate.png" alt="Fashionate app">
<p class="card_heading">Fashionate Landing Page</p>
<p class="card_info">Card Info</p>
</div>
<div class="card">
<img src="images/adorabowl.png" alt="Adorabowl order page">
<p class="card_heading">Adorabowl Landing Page</p>
<p class="card_info">Card Info</p>
</div>
</div>
</div>
<div id="contact_section">
<h3>Like what you see?</h3>
<p>Let's work on something together!</p>
<button>Email me</button>
<h3>Find me on socials:</h3>
<div>
<img src="images/github_icon.png" class="icon" alt="github icon">
<img src="images/linkedin_icon.png" class="icon" alt="linkedin icon">
<img src="images/instagram_icon.png" class="icon" alt="instagram icon">
</div>
</div>
<div id="footer">
<p>Design by Megan Moulos, 2022</p>
</div>
</body>
</html>