Author Archives: Thomas

Assessment Prep

Posted on by

You are allowed to to bring a designed and optimized header graphic to class with you. Please choose from the following images…

If you have created the assessment directory during your practice attempts that is fine but please make sure the directory is empty prior to taking the assessment. You are expected to do all of the work in class during the set time. The only work you are allowed to do beforehand is creating the directory on the server and creating and optimizing your header graphic. Good luck.

Mobile Design Webinar

Posted on by

Mobile Design: Designing Tapworthy Mobile Apps with Josh Clark
Handouts:
http://www.uie.com/handouts/virtual-seminars/UIE_vs63_mobile_design.pdf

Assignment

Write a short review of the presentation including three takeaways or strategies that you can incorporate into your mobile interface design. Emailed to me before class on Tuesday. If you missed class please email and I will send yo the link to presentation. This is a graded assignment.

Applied JavaScript

Posted on by

Assignment

Find and complete one jquery tutorial on the web. Upload the finished project to your web space and send me a link to the working example. Finish as homework due Thursday (4.17.12). When evaluating the script make sure that the page is still usable without Javascript enabled. You should pick something that can be integrated into your current site to meet the above mastery requirement.

  • Resources 1 | 2 | 3

Work Session – Tablet/Desktop Design

Posted on by

This week you should be focusing you design efforts on the tablet / desktop version of your site. Taking the mobile design you have been working on the last few weeks you should build off of that initial design work using media queries to establish breakpoints for the devices you wish to target. Make sure you use all of the tools at your disposal for testing. If you need to refer back to this module.

Assignment

By the end of the week you should have in place the css for both the mobile and tablet versions of your site.

Experimenting with JavaScript

Posted on by

JavaScript

  • Script Resources | More
  • In-class assignment – On a blank HTML page implement a JavaScript from Dynamic Drive. Upload to the web and email me the link. Included in the document should be the URL where you got the script and any enhancements you made to the script. Extra credit will be given for any script that have been enhanced from their original format.

Assignment

Read the following Article on Progressive Enhancement. Send me an email (tswallace@ualr.edu) explaining progressive enhancement in your own words. Please discuss why it is important to use progressive enhancement and include a link to another article you found and read relating to the topic. Due before class Thursday.

Exploring CSS3

Posted on by

Assignment

You should have the finishing touches in place on your mobile interface by the end of the week. Be prepared to discuss how, where, and why you have incorporated css3 into your interface designs in class on Tuesday. It is not a requirement to use in the final product but I’d like you to experiment with it.

JavaScript and Forms

Posted on by

JavaScript

  • Script Resources
  • In-class assignment – On a blank HTML page implement a JavaScript from Dynamic Drive. Upload to the web and email me the link. Included in the document should be the URL where you got the script and any enhancements you made to the script. Extra credit will be given for any script that have been enhanced from their original format.

Forms

Assignment

Read the following Article on Progressive Enhancement. Send me an email (tswallace@ualr.edu) explaining progressive enhancement in your own words. Please discuss why it is important to use progressive enhancement and include a link to another article you found relating to the topic. Due before class next Monday.

Classroom Lab Time

Posted on by

We’ll use today’s session to continue work on the mobile view of our project websites. By Tuesday of next week you should have a at a minimum the html structure in place along with rudimentary “mobile first” css. We’ll spend next week working with CSS3 as a means to polish our interface.

Assignment

Spend some time browsing some of the usable CSS3 properties on this page. We’ll discuss usage and implementation on Tuesday.

Accessibility and finalizing your page template

Posted on by

Assignment

Continue to work on your site design and template. Bring questions to class for Tuesday’s Site building demo.

Class Example

Announcement + Extra Credit

Join the Society for Computing and Information Science tomorrow evening at 6:00pm in the EIT auditorium for a webinar entitled “The How and Why of Responsive Web Design” with Ethan Marcotte. Afterwards we’ll head to Buffalo Wild Wings for dinner. Hope you can make it.

If you write a short summary of the presentation and submit by next Tuesday you will be eligible for up to 10 points of extra credit.

 

Working with .htaccess files

Posted on by

Assignment

Send a visual mock-up of your mobile site to me before class on Tuesday. This can be a design file from Fireworks or Photoshop or the actual html and css.

Announcement

Join the Society for Computing and Information Science tomorrow evening at 6:00pm in the EIT auditorium for a webinar entitled “The How and Why of Responsive Web Design” with Ethan Marcotte. Afterwards we’ll head to Buffalo Wild Wings for dinner. Hope you can make it.

Prepping and adding images to your site

Posted on by

Assignment

If you haven’t done so already you should generate a color scheme for your web portfolio. Please read through the following module on Colors and Fonts. At this point you should be putting the finishing touches on your portfolio design concept. If you are not you should spend considerable time finishing that up this week. Next week we will discuss finishing touches to your template page, validation and duplication.

CSS Positioning Review – Building Graphics with Fireworks

Posted on by

Assignment

Create Banner image for your portfolio website in Fireworks. Image should be as wide as your container div and between 80px and 200px tall and less than 40kb in size. Emailed tswallace@ualr.edu before class the Tuesday following Spring Break.

Site Planning and Prototyping

Posted on by

Assignment

Refine your site concept and create a preliminary sitemap for the site/app. Experiment with one of the prototyping tools we discussed in class and build a prototype of the mobile view of your new site. This only needs to an outline. No need to do a full design treatment at this point. We’ll use this as a starting point for laying out the mobile version of our site when we return.

Use Kuler or a similar tool to generate a color scheme for your web site. You should make note of the hexadecimal color values of your scheme. If you need more information check out the following post on deciding on good colors.

 

 

Mobile Web Final Project Brainstorm

Posted on by

I’d like you to spend this session coming up with and idea for a final project web site. I’d like this project to incorporate the the use of responsive design practices and utilize some of the new html5 api’s. I’ll give you a clear list of technical requirements after spring break. You are welcome to work individually or with a single partner. This can be for a fictitious client or a real world client or project. Be creative. Pick something you are interested in learning more about. I’d like you to write a paragraph or two explaining the project and what you hope to accomplish/learn by completing the project. Please email this to me before class on Tuesday. Be prepared to discuss your idea in class.

Working with Paths in Fireworks

Posted on by

Your assignment for this session is to complete the following tutorials and submit the folder icon you create in the 3rd tutorial.

You should email this icon to me before class on Tuesday. Late submissions will not be accepted. I do not expect you to perfectly replicate the icon in the tutorial but I would like to see a solid effort from each of you. This is a challenging assignment so I encourage you to not wait until the night before it is due. Good Luck!

Responsive Images Lab

Posted on by

For this assignment I’d like you to evaluate and implement any two responsive image techniques from the homework reading (http://cloudfour.com/responsive-imgs-part-2/) or other techniques discovered via independent research.

On each of the example pages I’d like you provide a link to the technique along with a paragraph or two discussing ease of implementation and your perceived usefulness of the technique.

I’d like you to submit these URLs to me no later than class next Tuesday.

CSS Positioning Review and Building Graphics with Fireworks

Posted on by

Assignment

Create Banner image for your portfolio website in Fireworks. Image should be as wide as your container div and between 80px and 200px tall and less than 40kb in size. Emailed tswallace@ualr.edu before class next Monday. Remember this will be the image that sets the tone for your portfolio. Make sure it represents you well.

In Class Lab – Introduction to CSS

Posted on by

Please read through the following tutorials in preparation for our work with CSS on Thursday. We will move quickly through the content covered in the following write ups so I expect you to come to class with a good grasp of what is covered within the tutorials below.

CSS Basic

CSS Box Model

Note: I have your quiz grades which I will return to you in class on Thursday. I will have your html assignment graded and returned to you prior to class next Tuesday.

See you on Thursday.

HTML5 Odds and Ends

Posted on by

In-class Lab – Please Complete the following Tutorial and submit your online Resume to me via Email

Note: If you are uncomfortable with sharing any personal information with me  (or Google!) feel free use fictitious information. You may skips steps 8-10 if you’d like.

For more information on the subject check out the following resources

The goal of this exercise is familiarize you with the proposed Microdata Spec and to get your brain wrapped around its use. Be prepared to discuss in class on Thursday.

At this point I should have the following HTML5 related assignments from you…

  • Exploring Relationship Types Assignment
  • HTML5 Video Implementation with fallback for older browsers
  • HTML5 Audio Implementation with fallback for older browsers
  • Microdata Resume Exercise – Due Thursday

I will be grading these 4 assignments as the Skill-based Assessment grade for HTML5. Please make sure I have all of these before class on Thursday. They will not be accepted after that time.