299: Development Folder

School: Desktop/Shared Folder/Portfolio/ColorStudy

Bluehost: public.html/portfolio/index.html








299: Visual Precedence for My Website

Martha Stewart Home Page Top –
I selected this website as their intention tries to be for general users with devices large to small and new to old.

+ All images are clickable to the page.
-Notice the search sign needs to be clicked to actually get the search text entry space. Then the user clicks the box to be able to enter any character in the text box.

Martha Stewart Home Page Bottom –


Martha Stewart Food/Dessert & Treats Sub Page Top –

1. There is another navigation in the middle of the page.
2. It can slide the navigation to populate many nav tabs.


Martha Stewart Video Receipe Sub Page Top –

1. There are a logo & remark on the vid.
2. SNS links right below the vid.
3. There are many clickable video links.
4. There is no link to videos. How to get to any video, I searched “video.”



Noticed: Confusing but feasible solution of content on home and sub-pages.

  1. Each section has the color of its own.
  2. Each section has its own page.


Boot Strap Template below is somewhat closer to what I imagine for my home page.
Replace jumbo tron with hero image.

from UX Planet:

https://www.beckett.de/ has lots of moving parts and difficult understand the section separations.

One-page website -> Base for my home page
from https://www.designspiration.net/save/953883252379/

299: a John Doe Site – How minimally it is set.

Suggestion from Chris:

Start coding the website.

Start CSS with Table of Contents and No reset *{margin 0; padding 0;} etc.

Browser view and view its source HTML


Base Layout from ART128

299: Learning from Web Design of Others’

Accessibilty – will be added.

My initial considerations were:

  • simple navigation without confusioning where you are at
  • fast loading (lightness)
  • no design elements unless it needed
  • minimum clicking
  • avoidance of information overload
  • add warmth for SNS area

After reviewing others’ works I have found the following points

  • at any section of a page, navigation to other pages or sections
  • loading takes longer use subtle loading small light graysh 3 or 4 dots in the middle of screen
  • not to place unnecessary empty spaces
  • time to load (.sk country?, slow server?, content?)
  • I can use blog site (WordPress.com, Blogger.com, wp of my hosting site) to link through nav tab, update each entry. How to choose best blogging platform in 2018.
  • place dots right hand edge to go up/down the sections of the page
  • Nav tab visibility (no crash with background/scrolling page)
  • Some designers use home=work page

[Thanks to Melissa for the list of inspiration websites.]

ART299: Processing3, p5.js and Portfolio & DLC

Finish ART299 goals

– Human lives in a digital culture –

What would be updated way of living in this digital culture.
What would be the new library for the next generation? Is there a new study on Library 2.0?
The knowledge access is more limited than before for non-students.
How to keep democracy alive without knowleageable citizens?

It reminds me of Marshall McLuhan’s “The medium is the message.”

Then how about our privacy?

Issue of shall I backup all on my iMac contents to backup in cloud?
It is effective in data storage time and organization to avoid data loss, but what would I lose?
Is it important?
How would I know?

Separately, I was thinking what if all the typing keys of keybord, documents, seach engine use and all the accessed web url’s, all the forms and are kept tracked, would machine can understand my subconscious or unconscious self better than myself? Would it be OK? What would I lose?

Any way, all our telephone conversations are said to be stored somewhere (security conference 200? at Waikiki), do we still need to keep our privacy private?

The Dark Side of Cloud Computing address following issues.
This podcast talks about security concerns of cloud computing. For example, Amazon S3 cloud server, how secure they are. How the security is managed? Is it possible of being sold some information? In case of crash of those machines? Other issues to worry about? Location of the server – data security laws and regulations are different in different countries. Read the end-user agreement carefully – be careful on who owns the data etc..

Art Basel 2017

Mark Changizi: Topography of Language

Reading in the Brain Introduction section is available on-line.

Anatomy of a Program

Processing Tutorials

p5.js libraries and how to use them in html.

<!doctype html>
  <script src="p5.js">
  <script src="p5.sound.js">
  <script src="sketch.js">