web-portfolio/index.html at main · lindsaywardd/web-portfolio · GitHub

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
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="icon" href= "imgs/desktop.ico" type="image/x-icon">

    <title>Lindsay Ward - Software Development</title>

    <!-- <link rel="icon" href= ".png" type="image/png"> -->

    <link rel="stylesheet" href="style.css">
    <script src="https://cdn.emailjs.com/dist/email.min.js"></script>
    <script src="script.js"></script>
</head>
<body>
    <nav id="navbar">
        <div id="navbar-start">
            <img id="logo" src="imgs/lwLogo.png">
            <p1>Lindsay Ward</p1>
        </div>
        <ul id = "navbar-end">
            <li><a href="index.html">HOME</a></li>
            <li><a href="#projects">PROJECTS</a></li>
            <li><a href="about.html">ABOUT</a></li>
            <li><a href="contact.html">CONTACT</a></li>
        </ul>
    </nav>

    <!--  landing -->
    <section id="landing">
        <div id="landing-content">
            <h1>Software Development</h1>
            <p>Hi! I'm Lindsay, a passionate student software developer. I'm currently studying Computer Science and Psychology at Amherst College. </p>
            <!-- building/empowering ideas through code -->
            <div id="landing-buttons">
                <a id="my1" href="#projects">Explore Work</a>
                <button id="my2" onclick="viewResume()">View Resume</button>
            </div>

        </div>
        <div id="landing-photo">
            <!-- Add photo here -->
            <img src="imgs\Device4.svg" alt="Responsive Jewelry Store E-commerce Website Design Screenshot">
        </div>
    </section>

  <!--  content goes here -->

    <section id="projects">
    <h2>Projects</h2>
    <div class="project-grid">
        <div class="project">
            <h4 class="project-title">Bank Landing Page</h3>
            <div class="project-imgs">
                <img src="imgs/HooBankSS.png" class="projimgs" alt="Hoo Bank Website Landing Page Hero Section">
                <div class="overlay" onclick="goToProject4()">View Project</div>
            </div>
            <div class="project-info">
                <p>Designed, developed, and deployed a fully responsive landing page that aligns with modern web design principles and prioritizes user experience. This project emphasized user-centered design, creating an intuitive and engaging interface across devices.</p>
            </div>
        </div>
        <!-- Add carepulse here -->
        <!-- <div class="project">
            <h4 class="project-title">Carepulse Patient Management System</h4>
            <div class="project-imgs">
                <img src="imgs/pacman2.png" class="projimgs" alt="Pacman Artificial Intelligence Agent">
                <div class="overlay" onclick="goToProject2()">View Project</div>
            </div>
            <div class="project-info">
                <p>Developed algorithmic proficiency, strategic thinking, probabilistic inference, and hands-on AI development skills by building intelligent agents for Pacman using algorithms like Minimax and Expectimax. Gained practical experience with core AI concepts and techniques, yielding competitive and advanced Pacman agents.</p>
            </div>
        </div> -->
        <div class="project">
            <h4 class="project-title">Stylin' Wiring Jewelry</h3>
            <div class="project-imgs">
                <img src="imgs/Jewelry-E-commerce-Website-Screenshot.png" class="projimgs" alt="Stylin' Wiring Jewelry Website">
                <div class="overlay" onclick="goToProject3()">View Project</div>
            </div>
            <div class="project-info">
                <p>Designed and developed an e-commerce website for a wire jewelry business, focusing on UX/UI principles. Managed product photography and implemented user-friendly features to showcase their products.</p>
            </div>
        </div>
        <div class="project">
            <h4 class="project-title">Pacman A.I. Agents</h4>
            <div class="project-imgs">
                <img src="imgs/pacman2.png" class="projimgs" alt="Pacman Artificial Intelligence Agent">
                <div class="overlay" onclick="goToProject2()">View Project</div>
            </div>
            <div class="project-info">
                <p>Developed algorithmic proficiency, strategic thinking, probabilistic inference, and hands-on AI development skills by building intelligent agents for Pacman using algorithms like Minimax and Expectimax. Gained practical experience with core AI concepts and techniques, yielding competitive and advanced Pacman agents.</p>
            </div>
        </div>
        <div class="project" id="hide1">

        </div>
        <div class="project">
            <h4 class="project-title">Meal Planner Website</h3>
            <div class="project-imgs">
                <img src="imgs/meals2.png" class="projimgs" alt="Meal Planner Website">
                <div class="overlay" onclick="goToProject1()">View Project</div>
            </div>
            <div class="project-info">
                <p>Created and coded a website design that could offer meal suggestions based on user-provided ingredients, favorite dishes, and go-to meals. Integrated interactive 3D assets to enhance user engagement.</p>
            </div>
        </div>
        <div class="project" id="hide1">

        </div>
    </div>


    <!-- <div class="project-grid">

        <div class="project">
            <h4 class="project-title">Stylin' Wiring Jewelry</h3>
            <div class="project-imgs">
                <img src="imgs/Jewelry-E-commerce-Website-Screenshot.png" class="projimgs" alt="Stylin' Wiring Jewelry Website">
                <div class="overlay" onclick="goToProject3()">View Project</div>
            </div>
            <div class="project-info">
                <p>Designed and developed a website for a wire jewelry business, focusing on UX/UI principles. Managed product photography and implemented user-friendly features to showcase their products.</p>
            </div>
        </div>

        <div class="project">
            <h4 class="project-title">Meal Planner Website</h3>
            <div class="project-imgs">
                <img src="imgs/meals2.png" class="projimgs" alt="Meal Planner Website">
                <div class="overlay" onclick="goToProject1()">View Project</div>
            </div>
            <div class="project-info">
                <p>Created a website that offers meal suggestions based on user-provided ingredients, favorite dishes, and go-to meals. Integrated interactive 3D assets to enhance user engagement.</p>
            </div>
        </div>
    </div> -->
</section>

    <!--  skills, list 8 -->
    <section id="skills">
        <h2>Skills</h2>
        <div class="skill-logos">
            <!-- To add: React, Next.js, tailwind CSS -->
            <img id="l1" src="imgs/reactLogo.png" alt="React.JS Logo 7">
            <img id="l2" src="imgs/htmlLogo.png" alt="HTML Logo 1">
            <img id="l3" src="imgs/cssLogo.png" alt="CSS Logo 2">
            <img id="l4" src="imgs/jsLogo.png" alt="JavaScript Logo 3">
            <img id="l6" src="imgs/javaLogo.png" alt="Java Logo 4">
            <img id="l5" src="imgs/pythonLogo.png" alt="Python Logo 5">
            <img id="l7" src="imgs/githubLogo.png" alt="GitHub Logo 6">
            <img id="l8" src="imgs/rubyLogo.png" alt="Ruby Logo 8">
        </div>
    </section>


    <!--  contact/download resume -->
    <section id="contact">

        <div id="contact-content">
            <div id="contact-info">
                <h3>Get in Touch</h3>
                <p>Interested in working together?</p>
                <button id="contact-button" onclick="goToContactPage()">Contact</button>
                </div> </div>
    </section>
 <!--  footer -->
    <footer>
        <div id="footer-content">
            <div id="footer-nav">
                <ul>
                    <li><a href="index.html">HOME</a></li>
                    <li><a href="#projects">PROJECTS</a></li>
                    <li><a href="about.html">ABOUT</a></li>
                    <li><a href="contact.html">CONTACT</a></li>
                </ul>
            </div>
            <div id="footer-contact">
                <h3>Contact</h3>
                <ul>
                    <li>lindsayywardd@gmail.com</li>
                    <li>New York Metropolitan Area<img src="imgs/pinIcon.png" alt="Location Icon"></li>
                </ul>
            </div>

            <div id="footer-social">
                <h3>Connect with Me</h3>
                <ul>
                    <li><a href="https://www.linkedin.com/in/lindsay-ward-">LinkedIn</a><img src="imgs/linkedInLogo.png" alt="LinkedIn"></li>
                    <li><a href="https://github.com/lindsaywardd">GitHub</a><img src="imgs/githubLogo.png" alt="GitHub"></li>
                </ul>
            </div>
            <p>&copy; 2024 Lindsay Ward. Website coded by me</p>
        </div>
    </footer>
</body>


</html>