AoVi0HG0bEq-1

hangers

 front-end web development

To complement my design and conceptual skills, I completed a three-month Front-End Web Development certification. I learned to build a responsive website from scratch. I created the structure and style of my eCommerce site, Hangers, with HTML and CSS. Then, I used  JavaScript and React to apply interactivity (try the functioning filter!) before hosting the final page on a server. 

responsibilities 
Web Design / HTML / CSS / JavaScript / React

timeline
1 week
live url 
https://meenasfewdproject.surge.sh/  

back to basics

This certification was an opportunity to take a deep dive into how the web really works. As a designer, it was my chance to get familiar with the technicalities of projects I'm regularly involved with. From this design perspective I of course prioritized the look and feel of the web page and even branded it (see the logo!). In part inspired by my affinity for the modern minimalism of clothing sites like Abercrombie and the awareness of my coding skills being so fresh, I made the intentional decision to keep it simple. That includes simple hovers prompting shadows and color changes, clean sans serif fonts, and neutral colors. 

Group-34811

learnings

Without getting into the programming jargon, here's an overview of what I learned as a designer venturing into coding:

  • Fundamental building blocks of the web, adding and styling content with HTML and CSS
  • How to take a developer’s approach to problem-solving, coding responsive sites for the web
  • Power dynamic websites with interactivity (yes, this is another plug for the filter I built!)

Challenged by the lack of freedom I have in coding (compared to Figma, for example) when it comes to design, it was frustrating at times to not have my "vision" translate as seamlessly. I firmly believe this course made me a stronger designer and one who can better communicate with developers. I have a greater appreciation for how my work comes to life digitally and am proud to say I'm not nearly as intimidated by code as I was before. 

Screenshot-2023-06-12-at-11.23.00-PM Screenshot-2023-06-12-at-10.33.46-PM

© Meena Pyatt 2023

View