Skip to content

Latest commit

 

History

History
33 lines (21 loc) · 2.18 KB

README.md

File metadata and controls

33 lines (21 loc) · 2.18 KB

Final Static Comp Challenge

Specification

The static comp challenge is a series of three challenges to keep you working that HTML/CSS muscle. You will be asked to recreate a static comp, with each growing in complexity. For each challenge, you’ll be given a static comp and asked to recreate it. Don’t worry, we’ll give you a bit of creative license, however the objective is to build something that respects the integrity of the original design. Once you get into the workforce - building out comps that reflect the designer’s choice in layout, spacing, font, imagery, and color to the smallest detail is a requirement.

Things to Note

We have not provided you with any assets, nor native files. You will have to source assets on your own per the creative license guidelines below. We have not provided breakpoint specific comps. You will need to employ some creativity here with a heavy dose of good judgment. Think about how you, as a user, could best experience the content/layout across various screen sizes. Is the content legible? Does the imagery (especially full bleed background images) still make sense and look good? Do portions of the nav become icons (and are they intuitive?), or a menu?

Personal Notes

The static comp challenge is a series of three challenges to work on HTML/CSS.

This static comp was built from scratch. In this project I used scalable svg fonts, CSS grid and Flexbox. There is very little JS. The JS is only used for a mobile menu to show mobile functionality.

Comp given

static-comp-challenge-3

My final Comp is below

Resolution 1680 x 1050

screenshot-2018-2-28 camilo comp challenge 3 2

Ipad

1024 x 768

screenshot-2018-2-28 camilo comp challenge 3 5

Iphone6

375 x 667

screenshot-2018-2-28 camilo comp challenge 3 6