-

## Let's start at 12:10PM

- Take a moment to review the **course outline on D2L**
- Recorded session to be made available on YouTube (unlisted)
- Please consider completing **Remote Learning Survey**

#### View online at https://ckportfolio.com/slides/pc8005-w1

---

## Let's get started ...

---

## The Virtual Organization

#### PC 8005 - School of Professional Communication - Week 1

https://ckportfolio.com/slides/pc8005-w1

---

## A quick hello

- **Chris Kim**
- From advertising to computer science
- **Designer-engineer** hybrid
- Startups, development services, and research engineering

#### Why am I here?

- Passion in **bridging the gaps**
- Opportunity to meet **academic collaborators**
- **Thoughtful reflection** on the industry at large

---

## This is not a coding course

- Designed to **demystify digital communication**
- Focus on political, economic, and cultural **implications**
- Opportunity to **design solutions** to real-world problems

#### Would you like to learn how to code from scratch?

Reach out for online course materials

---

## Learning outcomes

- Basic understanding of ICTs
- Perspectives necessary to critique the role of technology
- Contribute to emerging discussion of the effects of technology

#### In a nutshell: **become an effective consultant** in digital media

---

## Key activities

- **Explore**: Read articles and dissect products
- **Code**: Demystify using coding exercises
- **Brainstorm**: Look ahead for opportunities
- **Design**: Solidify your idea
- **Present**: Show, tell, and gather

#### Get into the rhythm of cycling through these activities

---

## Technologies

- **Coding**: Terminal (SSH) and Visual Studio Code
- **Planning**: Diagrams.Net, Figma, G Suite

#### Platform-agnostic: available on macOS and Windows

---

## Learning resources

- **Weekly readings**
- **Screencast tutorial**
- Sample code as applicable
- Adhoc troubleshooting (Slack recommended)
- Hosted server (https://procom.ckprototype.com)

---

## Typical session

#### Synchronous

- **Weekly check-in** via Zoom (45 to 60 minutes per week)

#### Asynchronous

- **Coding tutorials / exercises** (20 to 40 minutes per week)
- **Readings** (15 to 30 minutes per week)
- **Assignments** (45 to 60 minutes per week recommended)

#### Hybrid

- **Adhoc troubleshooting** via Slack, email, or Zoom

---

## Techical exercises

- Each exercise dedicated to a specific concept
- Designed for open-ended expermentation; **pass-fail grade**

#### Topics (tentative)

- **Communicating with command-line** (this week)
- Visualizing data
- Automating tasks
- Designing databases
- Building "smart" applications

#### Each submission to be **accompanied by a short write up**

- Approximately 100 words
- Challenges, surprises, and opportunities observed

---

### There are many problems out there

- Which problem would you like to solve?
- How will you solve this problem with technology?
- What market opportunities will you capture?

---

## Assignments

#### Assignment 1: Problem / Solution Pitch

- **Idea**: Overarching vision and key elements

#### Assignment 2: Interactive Wireframe

- **Look-and-feel**: Visual design and user experience

#### Assignment 3: Product Presentation

- **Promotion**: Marketing rooted in deep research

#### More details to be introduced in subsequent weeks

---

## Reading Group

#### Choose an emerging technology, tell us about it

- No longer than 15 minutes
- Presentation recording available to all students

#### More details and sign up sheet made available in Week 2

---

## Learning support

- Exercises **designed for novices**
- All course content available via **D2L**
- Support via Zoom, Slack, and email (in order of immediacy)
- Post-conference Zoom Q&A ("hang out")

#### **I am your resident engineer**

Tell me your idea, and I will help every step of the way

---

## Any questions?

Moving onto the first week's content ...

---

## Today's agenda

- **Wired and wireless**
- Going online
- Brief history of the Web

---

## A series of tubes

#### Coined by Ted Stevens (R-Alaska)

---

## Network neutrality

- **"All Internet traffic should be treated equally"**
- Challenged by the FCC and ISPs
- Discrimination by protocol and IP address

#### Strong opinion, poor understanding

"An Internet was sent by my staff at 10 o'clock in the morning on Friday. I got it yesterday [Tuesday]. Why? Because it got tangled up with all these things going on the Internet commercially."

---

## Networking in the 1850s

#### Underwater cable across the English channel

---

## Transatlantic communication

#### Electrical Morse code between Europe and America

---

## Initial contributions

- Damages: bankruptcy, stock exchange speculations, etc.
- Speed: 2 to 3 minutes to transmit a single character
- Economics: Information flow contributed to trade

---

## Modern tubes

#### 99% of all intercontinental communication handled by fibre optics

---

## Fibre optics

- **Speed of light**
- Round trip between New York and London in 56 milliseconds
- Prone to damage --- more suited for longer distances

---

## Wireless connectivity

- Wi-Fi: Limited to local areas and access points
- 2G, 3G, LTE, and 5G: Frequency assignments
- Satellite: Slow, expensive, and niche

---

### "A squirrel is chewing on your Net"

#### Number one culprit for animal damage to fiber

---

## Physical side of the internet

"We talk a lot about the cloud, but every time we put something on the cloud, we give up some responsibility for it. We are less connected to it. We let other people worry about it."

#### - Andrew Blum, TEDGlobal 2012

---

## Today's agenda

- Wired and wireless
- **Going online**
- Brief history of the Web

---

#### "Can you count with your fingers?"

---

## It really is about 1s and 0s

#### Source code of Pokemon Red (Gameboy)

---

## Transition to digital goods

- Higher fidelity due to compression and larger storage device
- Consistent quality vs. analog cassette tapes
- Data is much more malleable

#### Analog captures the natural world itself, but prone to distortion

---

## Digital was around

- Teletypewriters (Early 20th century)
- Error detection (1950s)
- Local area network (1960s)
- Serial ports (1970s)

#### Only has become ubiquitous and accessible for mass access

---

## Internet in the Cold War era

- "What if our centralized data center gets nuked?"
- "What if they are listening in our one-on-one conversations?"

#### Break up with **packet switching** and **decentralization**

---

## "Hello world" in ARPANet

#### **"Hello"** through path A, **"world"** through path B --- then combine

---

## Unique identifier

#### **Quickly running out** of available IP addresses, moving to IPv6

"All students share the same global address (1000 College Drive, Anywhere, VT 08759, for example), but they each have an internal mailbox within that system."

---

## Emergence of email

- Initially a mechanism for simply creating a **text file** in a folder
- **Incentive** to join a certain ISP (AOL, Yahoo, etc.)
- Grew to compete against other postal service companies

#### Subcommittee hearing in 1982: "The Future of Mail Delivery"

---

## Networking for the masses

#### Apple II + telephone line = hobbyist internet in the 70s

---

## Pre-Reddit bulletin boards

#### Interest-based Usenet in the 80s

---

## PCs and networking

- Rise of network-friendly computers
- Competition between ISPs
- Still much a hobbyist effort

---

## Moore's Law emerges

#### "Semiconductor density to double every 2 years"

From 9 million to 1,500 USD in 20 years

---

## Today's agenda

- Wired and wireless
- Going online
- **Brief history of the Web**

---

## Geocities

---

## Web in the 90s

- Programming skills
- Hosting cost
- Slow speed 
- Time and patience

Despite the efforts, the final results were **less than desirable**

---

## Making a comeback

https://brutalistwebsites.com/

---

## Code-free options out there

- Wix
- Squarespace
- Weebly
- WordPress.com

Are they **good enough** for designers?

---

## Great for novices

#### Terrible for control freaks

---

## Disadvantages

- Preset templates
- Little to no customization
- Lack of technical support
- Ultimate need for programmers

**Harsh constraints** for creatives

---

## Code as a solution

- Complete control over your product
- Time sink, but a valuable asset
- Written code as the product of your thought process

---

## Code as an asset

- Means of creative expression
- Tool for self-awareness
- More than a line item in your CV

---

## State of the arts

It's a heavily abstracted mess

---

### "Hey, I got this new web project."

"I haven’t coded much web in a few years and I have heard the landscape changed a bit."

---

### "I know the latest tech."

"You should try learning React, It’s a super cool library made by some guys at Facebook, it really brings control and performance to your application, by allowing you to handle any view changes very easily. But first you need to add React and React DOM as a library in your webpage. So one is the actual library and the second one is for manipulating the DOM, which now you can describe in JSX. JSX is just a JavaScript syntax extension that looks pretty much like XML. It’s kind of another way to describe the DOM, think of it as a better HTML."

---

### What happened here?

---

## Industry may have matured

- New technologies to perform more complex tasks
- Abstraction helps the developers to be productive
- "Why grind coffee by hand when you have Nespresso?"

---

## Industry has gotten lazy

- Still based on the 80/90s core technologies
- Corporate interests (Facebook vs. Google)
- Core technologies have not changed since the inception
- Layers and techniques have

#### Code bootcamps make it worse

- Favoring specific tools that are not time-tested

---

## 1990s website ...

---

## ... Isn't so different

---

## Inventor of the Web

#### Tim Berners-Lee

---

## First website ever

#### Designed to imitate Word documents

---

## Hyperlink

#### Revolutionary, now taken for granted

---

## Commercialization

#### Introducing colour, multimedia, and advertising

---

## Dialup to ethernet

#### A place where information is gathered

---

## Web 2.0

#### A place where work (or play) gets done

---

## 1.0 vs 2.0

- Netscape Navigator vs. Google Chrome
- Britannica Encyclopedia vs. Wikipedia
- Email vs. Facebook Messenger

#### Always connected, always fragmented

---

## Takeaways

- Digital communication remains surprisingly physical
- Tech imitates life as we know it
- Web is more than a tool --- now a platform

---

### Mandatory tasks for this week

- Course readings: evolution of tech, behaviour, and society
- Technical exercise #1 (goes live at 6PM)

#### All details available on D2L

---

### Things to expect next week

- Concept: Data storage and retrieval
- Introduction: Assignment #1 and Reading Group

#### Start exploring and brainstorming for the first assignment

---

## The Virtual Organization

#### PC 8005 - School of Professional Communication - Week 1

https://ckportfolio.com/slides/pc8005-w1