https://github.com/launchscout/design_exercise
This is an exercise to show us where your front-end skills are.
https://github.com/launchscout/design_exercise
Last synced: 10 months ago
JSON representation
This is an exercise to show us where your front-end skills are.
- Host: GitHub
- URL: https://github.com/launchscout/design_exercise
- Owner: launchscout
- Created: 2013-04-11T15:02:26.000Z (over 13 years ago)
- Default Branch: master
- Last Pushed: 2018-09-19T21:31:46.000Z (almost 8 years ago)
- Last Synced: 2025-10-06T19:02:53.623Z (10 months ago)
- Language: CSS
- Homepage:
- Size: 919 KB
- Stars: 3
- Watchers: 32
- Forks: 7
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
Front End Exercise
==================
This is an exercise to show us where your UI/UX design and front-end skills are. Feel free to use any tools or frameworks you want.
## Getting Started
Download this repo
## Step 1
Create an HTML5 page with a `header`, `footer` and `main` section in `index.html`. The main section should contain a content section and a sidebar. Make the sidebar align to the right side of the content section.
`index.html` should include:
- `test.css`
- `test.js`
- `https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js`
The header should include a nav with three links:
- Home - index.html
- About - /about
- Blog - /blog
## Step 2
In the content section of the site, build out a simple blog post that has a featured image. Feel free to pull in some alternative placeholders with something like [Zombie Ipsum](http://www.zombieipsum.com/) or [Cincy Ipsum](http://www.cincyipsum.com/) for text and [Fill Murray](http://www.fillmurray.com/) or [Place Kitten](http://placekitten.com/) for the image. Design this however you would like, we want to see your style shine through.
## Step 3
Using CSS, make `index.html` responsive. Style from mobile through desktop views.
## Bonus
- Write your styles in SCSS, SASS, or LESS
- For using BEM methodology
## I'm Finished!
- Awesome, now attach a zip of your finished code exercise with your application [here.](https://teamgaslight.com/careers/designer)