Visual Design A4: Design Systems pt.4

This week marks the end of our 4-week long project Design Systems. For this assignment, we had to design a poster, article spread, and website landing page for a hypothetical symposium taking place at NYU. Since I divided the three different deliverables into three weeks accordingly, I focused on creating the website this week using layout grids.

Before jumping into my website, I knew I needed to wrap up my article spread and posters from the previous weeks with some new feedback I have gotten. Some people pointed out that the pink I have been using throughout my design could be a bit darker and more saturated. So I went back and tweaked the color and made it warmer and a bit darker. For the poster, I only modified a few minor details and corrected some errors I have found in my body copy. I also added the subtitle in (finally). Here’s a preview of my poster:

For the article spread, I modified the padding around my images, changed the justification, and minimized rivers by adjusting the justification settings and paragraph styles. Compared to last week, the document now looks more organized and clean.

With these two parts done, I moved on to the website design. I knew the colors and layout are going to follow my previous designs, so it wasn’t hard for me to come up with an idea and start sketching.

I used a 12-column layout with margins at 50 pixels and gutters at 25 pixels. I also added 12 rows just to provide more reference points. I want to follow the ascending layout in my poster but also create some visual interest. So I played around with the layouts in my landing page and speakers page

For the itinerary, I knew it would look cramped if I tried to squeeze everything into a 1920*1080 frame, so I took advantage of the dynamic layout and made the entire section longer than 1080.

I also added a highlight for the keynote talk just to provide more details and emphasis on the final event. Overall I am satisfied with how the website turned out.

All three deliverables are linked in this shared folder (only viewable within NYU): https://drive.google.com/drive/folders/1MmIvvlWDqInISrySduZ9XEWwsU8J2zWN?usp=sharing

[04/09/2021] All files are updated with grids.

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store