Select Page
Digital Imaging IV
Class 08: Final Website Project

Topics

    • Interactive Components
    • Adobe Creative Cloud Express
    • Final Website Project

Don’t leave this class!

Interactive Components

Interactive Components:

Dynamic elments are produced with JavaScript generally. JavaScript is a quite a bit more advanced than HTML and CSS. It is a subject that could be multiple subjects in itself. Luckily, Bootstrap has JavaScript built into it that has templates we can use to add elements such as a carousel, accordian, navbar, etc. The difficult part is formatting it.

Here is an example Carousel (also called a slider)

This would be a caption 

Here is an example Carousel (also called a slider)

This would be a caption 

Here is an example Carousel (also called a slider)

This would be a caption 

This is an accordion similar to Bootstrap

This is the expanded body

This is an accordion similar to Bootstrap

This is the expanded body

This is an accordion similar to Bootstrap

This is the expanded body

This navbar is a bit ugly but you get the idea

Adobe Creative Cloud Express

Adobe Creative Cloud Express:

Express is a suite of tools available in your browser or mobile app that allows a user to complete basic image and video editing tasks. Templates, premade assests, and basic shapes are provided to create visual work that is targeted towards social media. It’s strengths lie in its ease of use and quickness but lacks the ability of full-fledged programs to complete smaller more detailed specific work.

According to Adobe:

Quickly and easily make standout content from thousands of beautiful templates with the all-new Adobe Creative Cloud Express. Available on web and mobile.

Creative Cloud Express makes it easy to get started with thousands of beautiful templates, plus assets for social media content, logos, and more. Feel like you’ve got the help of a trusted designer in your corner with the entire Adobe Stock* royalty-free photo collection plus a full library of Adobe Fonts at your fingertips.

Make anything you need, all in one place, with intuitive tools that let you remove backgrounds, animate text, add your brand, and so much more. With just a few taps you can resize content for any social media site and add Adobe Photoshop quality effects in a snap.

Share logos, fonts, and other brand elements with your team, and print and share PDF documents with features powered by Adobe Acrobat — so you can always put your best work forward.

Adobe Creative Cloud Express

Final Website Project

Final Website Project

Using the same process you employed in the labs to create a multi-page site you will produce your own custom site using an orginal company/brand. This may be whatever you like but should have at least a homepage and two subpages. Dreamweaver should be utilized along with the Bootstrap framework to create the site.

You will be graded on the following:
  • Basic Document/File Structure & HTML and CSS:
    • Master folder created with correct sub folders.
    • All files named and placed correctly.
    • Varied and correct HTML tags employed.
    • Robust set of CSS rules applied.
  • Bootstrap
    • Functional responsive grid made of rows and columns employed.
    • Bootstrap components such as navbar or slider are used.
  • Aesthetic:
    • Interesting and appealing design.
    • Professional quality.
Resources:
Assignment Video Tutorials
You may watch the tutorial videos below to help you complete your assignment.

Assignment Video Introduction

Here are the instructions for the project

Wait! Before you go!

Did you remember to?

  • Read through the lecture
  • Submit Final Website Project on Blackboard
  • Post your project on the Final Website Project Critique Discussion Board
    • … and reply to at least two of your peers’ work on the Discussion Board