top of page

Create Your First Project

Start adding your projects to your portfolio. Click on "Manage Projects" to get started

CUNY Multimedia Programming Webpage

Date

May 2023

Project type

Website

Program(s) used

Figma, Visual Studio Code

I used Figma to create the layout of a directory for CUNY’s Multimedia Programming & Design degrees. I first mapped out the design of the home page which features a a navigation bar and search bar at the top of the page for additional CUNY resources. Below the site’s navigation bar is a “Learn More” button that provides more information about Multimedia Design degrees at CUNY. The navigation bar at the center of the page allows users to filter what area of study they are looking for based on discipline, degree, and location of school. The “Design News” section provides news about design at CUNY with their accompanying links. To the right of the “Design News” section is the “Events” section where site viewers can see upcoming design-related events at CUNY.
For each webpage featuring different degrees according to the user’s filter input, I used the homepage layout of the website and replaced the “Design News” and “Events” sections with cards showcasing the results of user input.

Using Visual Studio Code and HTML, I added the content and images of the homepage and coded each section of the page from top to bottom. I duplicated and modified this starter code for each page containing filtered results and adding the results cards. After adding in my content, I followed up with CSS to position and structure the content as well as add color. I also used CSS to allow for a responsive web page that could be viewed on different screens and window sizes.

bottom of page