In this assignment you will be repeating the group exercise we did in class 3 but on your own and with a different site.
STEP 1: FIND A SITE
Find an example responsive site that is NOT made by one of the large tech companies (apple/google/facebook/amazon/Microsoft/samsung/twitter/instagram).
STEP 2: CREATE SKETCHES and CONVERT TO PDF
Sketch the major site areas three times on three separate pieces of paper.
- Sketch of large layout
- Sketch of medium (tablet) layout
- Sketch of small (mobile) layout
Convert the paper sketches to digital with one of these tools:
- Dropbox App: https://help.dropbox.com/installs-integrations/mobile/document-scanning
- Scannable App: https://evernote.com/products/scannable
- Any other app that helps clean up and straighten up your image and convert it to a PDF or PNG file.
STEP 3: CREATE HTML FILE
Create a website project folder and in the index.html file write HTML elements to represent the boxes in your sketch. Remember that all three sketches should have the exact same boxes so at this point small/medium/large layout doesn’t matter.
STEP 4: SUBMIT the ASSIGNMENT
Upload your sketches and index.html file to Blackboard for Assignment 2.
Alternatively you can put all of your files on GitHub in a repository and send me the link to the repository in the comments for Assignment 2 when you submit it.
One thought on “Assignment 2: From Sketching to HTML”