fOjus has 33 post(s)

Please complete for this week:

Project 1 “Make it Better” — Part 1

Please go through part 1 of our first project and complete all materials there. Upload your proposal document that contains a nice presentation and compilation of your research to your b-server, and then provide a link to that as a post on this website with the Category ‘Project 1: Make it Better’ applied to it.

Reading and Response 

As part of Project 1, you are asked to read either Apple’s Human Interface Guidelines or Google’s Material Design guidelines. Respond to these documents through a brief paragraph of something you observed, didn’t know or realize before, or other thoughts about how these guidelines relate to the technology from these leading companies that  you have used. Minimum 5–6 sentences. Post it to this website as a comment below “Reading 2: Apple and Google Design Guidelines”.

Coding tutorials

1. Read Shay Howe Tutorials: Lessons 5–9
2. Codecademy Course:
   —Sign up with an account at Codecademy if you have not already
   —Complete the Lesson #1 Introduction from the Course Learn Javascript

Wikipedia Mini-project

Continue working on your Wikipedia redesigned page, Part 2 of that project.

Google Slides

Summary of Topics:

• Folder and file structure; File Naming & Organization
• Block Level vs In-Line Elements; the normal flow
• Display Property
• The Box Model
• CSS Floats
• CSS Positioning
• Transitions
• Animations

The following are for our next class.

1. Buy:

Buy Designed for Use by Lukas Mathis

2. Reading and Discussion Question:

Please read The Unbearable Homogeneity of Design and post 1 discussion question in the slack channel for Reading 1.

3. Sign up for InVision

InVision is online, browser-based prototyping application that allows us to make simple functioning web prototypes out of static images we generate from Sketch or Photoshop. As a class, we get a free InVision account.

If you don’t have an account yet, please sign up here with your school email address (It will only take a few seconds): http://www.invisionapp.com/education-signup . For this sign-up, you’ll need a verification code, which I will email you separately.

If you already have an account, email our InVision education rep Nadav (nadav@invisionapp.com) from your newschool email address. Mention that you need an upgrade as part of my class, and tell him your expected graduation date.

4. Read through Lessons 1–4 of Learn to Code HTML & CSS

Shay Howe provides a really nice overview of HTML and CSS. Especially if you have not had HTML and CSS yet, please read through Lessons 1–4

5. Review HTML and CSS basics Demo Code

I introduced these files to you in the first class, but it is good to review them on your own in more detail. They include explanatory text in the form of comments in the code.  Download the Zip document, unzip it, and review the following files by opening them in Sublime Text:

• structure_full.html
• text.html
• links.html
• img.html

6. Create a personal Homepage

Your homepage will serve as an organized place to post and access your web exercises and projects. Create an organized folder structure which includes the main page, an index.html page. To create theindex.html page, duplicate the html.html template document I shared on Slack and rename it.  Then add some simple content: your name, a small blurb about yourself, and links to the anticipated projects. Finally, add some simple styling (colors and fonts). If you are able to make more complex css styles, go for it. See below for examples of my own homepage and the associated folder structure:

7. Upload your homepage to the B Server

• Parsons provides student hosting space, called the B Server. You’ll receive instructions to log in from an email later this week. The subject line will read “Root”. You might have to check your SPAM folders, but be on the look out for that email, which looks like this:
  
• Use an FTP Client such as Cyberduck or FileZilla, as well as the log-in information provided in the email, to make a connection to your server space.
• Simply drag your files from your local machine into the FTP client window (specifically the public_html folder), and you should see a transfer or upload of files happen.
• Go to your B Server site. In my case it is http://b.parsons.edu/~doshio/, but you will replace the last part with your own user name or whatever has been indicated in the credentials email you received.

8. Continue to Style your Wikipedia Page

Continue with Part 2 of the Wikipedia mini project. You will work more on it during class, but get as far as you can.

Demo-Code

Click the link and save the page.

html

Please read the following article and add a discussion question in the appropriate Slack channel for Reading 1. Discussion questions must be posted by 12pm on the day of our next class (9.7.2017)

https://medium.com/@morgane/the-unbearable-homogeneity-of-design-fe1a44d48f3d

An introduction to the class, and a overview of HTML and CSS

Google Slides