General Problems with Portfolio Case Studies

I graded your portfolios academically based on three criteria:

• Overall quality of College and Career Plans ... 1/3 of grade
• Case Studies content ... do they follow the instructions? Do they have suitable problem and solution? ... 1/3 of grade
• Case Studies grammar ... 1/3 of grade

Curly Quotes

When you copy and paste from Google Docs (or MS Word) into a web page, you have to change the "curly quotes" to "straight quotes." Curly quotes look like upside down commas or cashew nuts. Straight quotes look like, well, short straight lines. For coding, we always want to use straight quotes. You may use curly quotes in your case studies, but you can't just copy and paste them from Google Docs, because they may not look right on all devices (see the printouts I gave back to you). Here is a page that describes the problem and how you can use HTML entities to fix it:

https://practicaltypography.com/straight-and-curly-quotes.html

 Note: I did not mark you down for this, but you should try to fix it if there are not a lot of them and/or you have extra time to fix things.

Case Studies Problem and Solution

Many of you wrote up solutions that we did not actually do, like adding extra features to the programs to make them better. We are looking for the solutions we actually did implement, not solutions that we could have done. What problem did you actually address and how did you address it?

Also, the problem and solution should be user-centric, not programmer-centric. Here's a tip: any time you mentioned code, JavaScript, SVG, or any coding term, you were talking about your problem as a coder, not the target audience problem you were trying to solve. Many times you actually do have your finger on the problem and solution, but you need to find a way to say it in a different way. For example, your solution may have been an algorithm, but it's better to say you used algebra or other math. Your solution may have been a web site that helps us (such as with the molecules).

Portfolio Grading (technical)

I still have not graded the academic portion of your portfolio because I have not figure out how to do it efficiently. I need to check the grammar on every page, every case study, and the college plans.

For the technical part of your portfolio grade, I calculated like this:

1. The first number at the top of the page is the number of violations on the front of the page.
2. The second number is the number of problems I listed on the back of the page.
3. The number in the NO block is FRONT + BACK/2
   • (That is, the problems on the back of the page have half the weight)
4. Then I ranked the scores in order and assigned a letter grade to each one.

# Problems	Score	Grade
1.5	97	A
2	95	A
2.5	93	A
3.5	88	B
4	86	B
4.5	84	B
5	82	B
8	75	C
11	65	D
15	58	F
16	56	F
16.5	54	F
17.5	52	F

Fisher-Yates Shuffle

function fyshuffle (stuff) {
    var array = stuff;
    var i = 0, j = 0, temp = null;

    for (i = array.length - 1; i > 0; i -= 1) {
        j = Math.floor(Math.random() * (i + 1));
        temp = array[i];
        array[i] = array[j];
        array[j] = temp;
    }
    return array;
}

Flipping Characters Upside Down

var flipTable = {
 "a":"\u0250",
 "b":"q",
 "c":"\u0254",
 "d":"p",
 "e":"\u01DD",
 "f":"\u025F",
 "g":"\u0183",
 "h":"\u0265",
 "i":"\u1D09",
 "j":"\u027E",
 "k":"\u029E",
 "m":"\u026F",
 "n":"u",
 "r":"\u0279",
 "t":"\u0287",
 "v":"\u028C",
 "w":"\u028D",
 "y":"\u028E",
 "A":"\u2200",
 "C":"\u0186",
 "E":"\u018E",
 "F":"\u2132",
 "G":"\u05E4",
 "H":"H",
 "I":"I",
 "J":"\u017F",
 "L":"\u02E5",
 "M":"W",
 "N":"N",
 "P":"\u0500",
 "T":"\u2534",
 "U":"\u2229",
 "V":"\u039B",
 "Y":"\u2144",
 "1":"\u0196",
 "2":"\u1105",
 "3":"\u0190",
 "4":"\u3123",
 "5":"\u03DB",
 "6":"9",
 "7":"\u3125",
 "8":"8",
 "9":"6",
 "0":"0",
 ".":"\u02D9",
 ",":"'",
 "'":",",
 '"':",,",
 "`":",",
 "?":"\u00BF",
 "!":"\u00A1",
 "[":"]",
 "]":"[",
 "(":")",
 ")":"(",
 "{":"}",
 "}":"{",
 "<":">",
 ">":"<",
 "&":"\u214B",
 "_":"\u203E",
 "\u2234":"\u2235",
 "\u2045":"\u2046"  
};

Comments on Portfolios

Here are some general comments on the portfolios:

• The current events article should not be called current events or research but should have some piece of the actual content on the home page icon, such as Bullying, Mental Health, Pollution, Depression, Fake News, etc.
• Every page should have a body font specified. 
• Files should be in folders together with the other files they need. Examples:
• Speedometer in same folder with engine sound
• College in same folder with background
• icons.html in same folder with the icons
• Current events home page in the same folder with the images
• Make sure all your top level page captions are spelled correctly.
• Navigation icons should be in a folder.
• Every page should have a copyright notice and they should be the same size as much as possible. (Use portfolio.css to set a standard.) They don't have to be the same color or font.
• Don't include any ZIP, PDF, or AI files in your portfolio. I just have to remove them, which adds more work for me, then you pay me back out of your grade.
• No capital letters or spaces in any file names. Change the names of your screen shots.
• Chinese Zodiac page requires some special styles to keep the navigation centered and avoid putting a border around it.
• The correct spelling is:
• SVG (all caps)
• JavaScript
• Adobe Illustrator (proper names, capitalized)
• Some basketball projects don't respond when I just click on them. Should move the ball toward the click. Requires like one extra line of code.
• Buttons on the clock project should be at least 48x48 pixels. I marked you down once when you turned the projects in. Why get marked down again and lose points twice for the same mistake?

Portfolio Requirements

Checkpoints

• All icons on the home page link properly to internal portfolio pages.
• All internal links should be HTML files: no SVG file, AI files, PNG files, or other file types.
• Use a placeholder logo if you haven't made a custom thumbnail yet.
• All thumbnail logos must be square (same height and width). No exceptions. 
• The page should have a DIV with a limited width that keeps the thumbnails from drifting around.
• There should be no underlines on or between links: put text-decoration: none on all offending <a> tags. 

• Every page must have a case study section with formatting supplied within the portfolio.css file.
• Exceptions: home page, current events page, and college plans do not need case studies.
• It's OK if some case studies are not complete, but most of them should be in place, and each page should have a placeholder (BMI) if it is not finished yet.

• Every page must have navigation arrows that are properly styled using the portfolio.css file. 
• Most pages must have navigation that works.
• If a few pages (current events, college plans, popup window) have navigation arrows, but the arrows don't work yet, I'll only mark you down a little bit.

Final Project

• All icons on the home page must be your original artwork, whether SVG, Adobe Illustrator, or screen shots of your project.
• All case studies must be complete.
• All navigation must work without any errors. 
• Every page must have a copyright notice in a footer.
• All pages should have a nice presentation (centering, fonts, colors, etc.)
• Pages that use fancy fonts (fortune, zodiac, tic tac toe) should use simpler readable fonts for the case studies. 
• All pages must work properly (basketball, tic tac toe, resistors, etc.)
• The portfolio should have a unified appearance enforced by the portfolio.css file.
• If I made suggestions on your checkpoints, thing seriously about following them.

Grades

I will post your latest grades today (Monday) or tomorrow (Tuesday). If there is some project for which I did not give you a grade, it is your responsibility to make sure I get it.

Printed posters will not go in your grade. But Adobe posters and logos will go in your grade. Make sure you turn them in properly.

If you did not get credit for some coding or Illustrator project and you think you turned it in, just turn it in again.

If I marked your project "missing," that means I didn't get anything at all. If I gave you a zero, it means you turned something in but did not follow the instructions.

Especially make sure you turn in all the academic projects such as logo essays, app ideas, thumbnail sketches (36), rough drafts (4), and case studies.