E Portfolio Unit 2



  1. Submit Site analysis as word document week two titled “Last Name Website Analysis 1.doc” to Faculty Boxes/smansfield/Inbox. 2 pts.
  2. Skills Inventory “Last Name skills.doc” to Faculty Boxes/smansfield/Inbox. 1 pts.

*Course Competencies from the CC250 Syllabus
At the conclusion of this course the student should be able to

3. Design a basic website interface.
4. Design and execute web-ready documents that use aesthetically pleasing design elements.
5. Create functioning web pages using a WYSIWYG page generator.
6. Prepare digital images for use in a hyper-linked document.
7. Convert existing project files into file formats suitable for posting to the web.
8. Publish a Portfolio website to a live server

VTC tutorials. Login process. Link in right sidebar. Mansfield site password. Brief review of resources.

Digital Tutors Access pdf

2A Logo

Using Illustrator, create a custom logotype/monogram. Treating letters as shape. Exploration.

Illustrator terms and concepts:

Native Illustrator File: .ai

Artboard Setup

Point Type object versus Area Type object

Browsing typefaces

Installing typefaces on a mac. Fontbook. .ttf or .otf file format.

Converting type to paths: Type/Create Outline

Exporting .png file

Uploading to Wix, placing into Muse

Nick Erickson  Sophia Kwon

20 Logos with Clever Negative Space

Hating on:

Papyrus Watch

Ban Comic Sans

I’m Comic Sans, A**hole

Royalty Free Font resources:


FontPark free fonts
Fontsquirrel free typefaces

On Installing fonts using Fontbook. Managing fonts. Using Fontbook to preview text.

Illustrator and Photoshop type basics.
Illustrator: type>create outlines, path editing, pathfinder.
Photoshop: rasterize type layer.


Kerntype: a kerning game

I Shot the Serif

Outputting .png file to preserve transparency

jpeg compression rot

50 Inspiring Examples of Hand Drawn Elements in Web Design

Discussion of Concept Statement homework
Discussion of first Assets folder, Due week 4.

Wix interface

from the ground up. Tools, menus.

Muse interface, from the ground up. Tools menus. Page Size screensiz.es

Page background: color or image?

Browser background: color or image.

Templates: check page size, keep page size consistent from page to page

Templates: replace all components with own.

Scanning review. Setting resolution, mode. Next week: photomerge.

Lab Time


  1. Word Document Post titled “last name_concept_statement”.  Copy and paste the content of this word doc into a post and follow its directions: Concept Statement.docx.
  2. Readportfolio
  3. Finish your Logo design, post it to your website header 4 pts. Bring .ai file to class next week for submission. Critique at beginning of class next week.
  4. Research: Find three portfolio sites in your field/profession. Review them. Write about their styling choices, navigation- did they use categories? Do they offer a resume?  Identify areas for improvement. Due as word document week two titled “Last Name Website Analysis 2.doc”
  5. Due week 4: First Folder of Assets. What will you feature on your site? pdf version of business plans, jpeg images of projects. Doc, .rtf, or .txt file containing captions for each image, informative text. Collect this first of three installments in a folder. 6 pts