Fabrication and Accessibility

# Fabrication and Accessibility
Discuss how Fabrication and Accessibility relate

CSE443: Winter 2026; Jennifer Mankoff (Last Edited: 2025-10-15). <a href="/courses/cse443/26wi/slides/3dprinting.html">Live View: /slides/3dprinting.html</a>

Important Reminder: check zoom & captioning

---
class: center, middle, inverse
# Announcements

---
## My situation

Family emergency is ongoing and still critical.

---
## Grading First person accounts

- AT around us first person competency grades released. 
- Some of you may see an update if you checked before 9pm sunday, I saw some things in the videos when I was grading document accessibility that I missed originally

---
## Grading document accessibility
- Document accessibility grades released
- I disagree with powerpoint about that violet font, but I gave anyone who turned in powerpoint positive points for contrast because powerpoint's checker said it was ok
- lots of you had trouble with reading order
- please upload your file in the future, it will make it much easier for us, intsead of providing a link!

---
## Regrades?

- Yes, but first we ask that you try the competency twice on two separate assignments. 
- This is because we want you to take what you learn from the comments and be able to apply it in a new setting.

- [Grading policy](https://courses.cs.washington.edu/courses/cse513/25au/syllabus.html#learning-and-grading)
- [Regrading policy](https://courses.cs.washington.edu/courses/cse513/25au/syllabus.html#does-the-class-have-a-regrading-policy)

---
## Coming up soon
- By Tuesday 10/21: Answer reading questions (I'll send a summary to Maya)
- Wednesday (10/22): Guest lecture by Maya Cakmak. I will be elsewhere. Can someone volunteer to help set up? 
- Keep going on HW 3: Accessibility Implementation. Let me know if you have any questions
- I appreciate the "async office hour" approach very much (i.e. post on Ed) but I can make time to meet by appointment if needed

---
## Proposal reminder
- Proposals due 11/3. To facilitate project team formation, please post your preliminary ideas and reactions on Ed by 10/25.
- We’ll reserve class time for groups to talk for 10 minutes on 10/27.
- We encourage you to use 10/29 class time to meet and do further planning
- You’ll present to class on 11/3

---
## Any other announcements or questions?

---
class: center, middle, inverse
# Learning Goals

---
## Today
- Talk about the value of additive manufacturing & physical computing in accessibility
- Cover some common approaches to making & physical computing
- Go into detail about a specific approach, laser cutting
- Begin modeling something

---
## A week from Wednesday
- Trying to set up a printing focused class. TBD

---
class: center, middle, inverse
# Accessibility and Fabrication

---
## Making in an accessibility course? Why?

.column[
What is craft?
]

.column[
- Fits real needs
- Comfortable
- Loving
- .lowlight[Creative]
- Practical
- .lowlight[Healing]
- .lowlight[Empowering]
- .lowlight[Subversive]

]

.column[
![:img A picture of Jen's child 3 at age wearing a white knit sweater; knit mittens and a knit hat. The mittens are a bit too large and he has his hands raised in the air to show them off and a smile on his face., 100%, width](img/3dprinting/arun-knitting.png)
]

---
## Making in an accessibility course? Why?

.column[
What is craft?
]

.column[
- Fits real needs
- Comfortable
- Loving
- .lowlight[Creative]
- Practical
- **Healing**
- **Empowering**
- .lowlight[Subversive]
]

.column[
![:img A picture of two different /knockers/: realistic stuffed crochet breasts for use by breast cancer survivors, 100%, width](img/3dprinting/knockers.png)
]

---
## Making in an accessibility course? Why?

.column[
What is craft?

[Vice Article](https://www.vice.com/en/article/8qwpzb/mark-my-words-the-subversive-history-of-women-using-thread-as-ink)
]

.column[
- Fits real needs
- Comfortable
- Loving
- **Creative**
- Practical
- Healing
- Empowering
- **Subversive**
]

.column[
![:img A picture of two  embroidered articles. The first dates back to 1890 and is the work of a German seamstress who had been consigned to an asylum. embroidered script in German is visible on a hanging piece of cloth. The second is an embroidered tv. Inside it is an image of a naked woman looking into a mirror with the word /Censored/ over her breasts where they show on the mirror. The image says /new mirrors by Facebook/ and /patriarchy approved/, 100%, width](img/3dprinting/subversive.png)
]

???
dating back to the 1890s, it's the work of a German seamstress who had been consigned to an asylum. Although it's often falsely described as her straitjacket, it was actually cut and assembled from a hospital gown, tailored and then turned into an autobiography wrought on fabric.

---
[Facebook Fashion Discrimination](https://www.nytimes.com/2021/02/11/style/disabled-fashion-facebook-discrimination.html)

![:img Two pictures of women wearing a grey cardigan and black pants. One is a white woman standing looking over her left shoulder as her white blond hair waves in the wind. She stands on a white featureless background. The other has brown skin and black hair and is posed in a wheelchair. Two pots with arrangements of dried flowers set the scene, 40%, width](img/3dprinting/fashion.png)

---
## What is craft?

- 1000s of years old
- Highly skilled
- Only labeled “arts and crafts” after the industrial revolution
- Often centered in women’s “busy” work
- Sometimes entrepreneurial 
- Exceptional at addressing unique and individual needs

---
![:img Three textbooks (Adapt my world by J. Rose Laxen; Illustrated guide to Assistive Technology & Devices by Suzanne Robitaille; and Assistive Technology Solutions in Minutes Book II by Therese Willkomm) and A screenshot of the Thingiverse website showing 3D printed accessibility technologies collected by user @glitchpudding last updated on July 22 i 2016, 50%, width](img/3dprinting/books-at.png)

---
## Modern crafting technology
.left-column50[
- New ways to ideate and create
 - Faster, easier, sometimes better
- New ways to customize
 - Faster iteration
 - Mass customization
- New materials
- New and/or more complicated shapes
]

--
count: false

.right-column50[
![:youtube Video of child using a 3D printed hand, WoZ2BgPVtA0]

]

---
## DIY Accessibility

Rapid iteration can help with accessible design

.left-column40[

![:img Rainbow loom to assist with knitting, 50%, width](img/3dprinting/rainbow-loom.jpg)
![:img Red knitting loom with white hooks to aid accessibility, 45%, width](img/3dprinting/loom.png)

]

.right-column60[
![:youtube Xbox adaptive controller intro, 9fcK19CAjWM]
]

---
## DIY Accessibility
.right-column60[

[Interactiles: 3D Printed Tactile Interfaces to Enhance Mobile Touchscreen Accessibility](https://make4all.org/portfolio/interactiles/) (ASSETS 2018)

![:img A picture of a mobile phone with a tangible scrollbar and number pad built into its case to help improve blind interaction with the phone,50%, width ](img/3dprinting/interactiles.png)

]

.left-column40[
Combination of materials
- Silicon & sewn conductive thread (could use conductive powder instead)
- Nuts and bolts
]

---
## Pause and discuss

Try to think of some everyday objects that could be made more accessible (customized through DIY making)

(think pair share)

---
[//]: # (Outline Slide)
# Who makes accessibility happen? (1/2)

Crafters with Disabilities

---
## Example: Knitters with disabilities

We interviewed 16 disabled knitters about their motivations, process, needs, and experiences of bias

- 11 Blind or Low-Vision
- 7 Motor-impaired
- 3 with Cognitive Impairment

We collected data from six forums to extend our sample size and complement our interviews with more motor and cognition related data

---
## Making Patterns Accessible

Pattern accessibility was a frequent problem for disabled knitters
- Forum posters mentioned over 40 different pattern formatting guidelines to make patterns more accessible
- Not just about nonvisual access

For example P14-MC, who wrote out patterns in detail, said:

.quote[...if it says you need to go and knit 16 rows, I’ll write out [all of them] and then I’ll mark them off as I go. (P14-MC)]

.footnote[MC indicates motor and cognitive impairment]

---
## Making Craft Accessible

Four participants (P1-MVC, P2-V, P5-M, P11-V) reported difficulty with small gauged looms

Both circular knitting needle and loom knitters experienced difficulty executing a purl stitch

.quote[...when I purl …[I] have to push my thumb down like that to get
tension… And so there’s a lot more pinching for me… and that
definitely causes discomfort the fastest. (P3-M)]

---
## Making Accessible Objects

.left-column[
![:img A neuro-diverse crochet robot wearing headphones with a big heart, 70%, width](img/3dprinting/neurodiverse-robot.png)

![:img A crochet robot with a prosthetic leg and a big heart, 70%, width](img/3dprinting/prosthetic-leg-robot.png)

]
.right-column[
The results of knitting solved accessibility problems for some knitters
- Patterns for toy robots with disabilities to increase the inclusion and representation of disability in the knitting community (P10-M)
- Tops for wheelchair users with a shorter back and longer front

.quote[if your sweater is too long in the back [and] goes underneath you, it's hard to transfer. (P14-M)]

]
---
## Community Ableism

Participants primarily participated in communities of knitters to learn, as support networks, project collaborators, and to increase inclusion.

Bias included assumptions about ability and even concerns about image, such as one forum poster experienced when a pattern designer *“didn’t like the idea of a wheelchair being in the shot.”*

---
[//]: # (Outline Slide)
# Who makes accessibility happen? (2/2)

Crafters with Disabilities

Domain Experts

- Medical makers
- People with disabilities
- ...

---
## Domain Experts

**A lot of research is needed here**

- Full power of software engineering
- Equivalent of end user programming
- Production and personalization of interactive systems
  - Modularity 
  - Requirements Specification
  - Hybrid Control over AI based systems (e.g. optimization)

--
This is a focus of a lot of my group's work

---
## Traditional Manufacturing

<div class="mermaid">
graph LR
A(Materials) --> B(Factory)
B --> D(Shipping)
D --> E(Storage)
E --> F(Shipping)
F --> G(You)

classDef blue font-size:14pt;
classDef green font-size:14pt;

class B,D,E,F blue
class A,G green
</div>

---
## The future (is here)
<div class="mermaid">
graph LR
A(Materials) --> B(Factory)
B --> D(Shipping)
D --> E(Storage)
E --> F(Shipping)
F --> G(You)

classDef blue font-size:14pt;
classDef green font-size:14pt;

class B,D,E,F blue
class A,G green
</div>

---

![:youtube Time lapse video explaining 3D printing, m_QhY1aABsE]

---
## Fabrication technologies are not

- ...the Star Trek replicator
- ...as fast as the best manufacturing solutions for bulk manufacturing
- ...as fast as your 2d printer
- ...inexpensive
- ...nice to touch (material range is limited)

**But** they can do a lot of interesting things

---
## Additive/Subtractive Manufacturing

<div class="mermaid">
graph LR
A(Materials) --> B(Factory)
B --> D(Shipping)
D --> E(Storage)
E --> F(Shipping)
F --> G(You)

classDef blue font-size:14pt;
classDef green font-size:14pt;

class B,D,E,F blue
class A,G green
</div>

class A,B,D lightblue
class E lightgreen
</div>

class A,B,D blue
class E green
</div>

---
## Additive Vs Subtractive

- Additive printing puts down material, building up the object layer by layer
  - Some are done with extruded plastic or other material
  - Others are done with powders that are sealed together (powder printers)
- Subtractive removes materials from around the object

---
## Example: CNC Spoon

![:youtube Video of a person using a CNC machine to make a spoon, caf5WDeBUaA]

---

# Machine Knitting
<div class="mermaid">
graph LR
A(Materials) --> B(Factory)
B --> D(Shipping)
D --> E(Storage)
E --> F(Shipping)
F --> G(You)

classDef blue font-size:14pt;
classDef green font-size:14pt;

class B,D,E,F blue
class A,G green
</div>

class A,B,D lightblue
class E lightgreen
</div>

class A,B,D lightblue
class E lightgreen
</div>

class A,B,D blue
class E green
</div>

---

# Creating Knitted Objects

![:img A knitspeak file contains text that is compiled into a knit graph and then compiled to machine readable instructions that can be used to produce a knitted result, 80%, width](img/3dprinting/knitting-process.png)

---
## Creating Knitted Objects

![:youtube Video a knitting machine, t2Lpk4Jal6o]

---

# Laser Cutting
<div class="mermaid">
graph LR
A(Materials) --> B(Factory)
B --> D(Shipping)
D --> E(Storage)
E --> F(Shipping)
F --> G(You)

classDef blue font-size:14pt;
classDef green font-size:14pt;

class B,D,E,F blue
class A,G green
</div>

class A,B,D lightblue
class E lightgreen
</div>

class A,B,D lightblue
class E lightgreen
</div>

class A,B,D blue
class E green
</div>

---
## If you want more

.left-column50[

[3D printing for health](http://make4all.org/portfolio/3d-printing-for-health/)

[More materials](http://make4all.org/portfolio/3d-printing-in-a-range-of-materials/)

[Metamaterials](http://make4all.org/portfolio/metamaterials/)

[3D printing for education](http://make4all.org/portfolio/3d-printing-for-education/)

]
.right-column50[

[Interactive objects](http://make4all.org/portfolio/3d-printing-of-interactive-objects/)

[3D printing and sustainability](http://make4all.org/portfolio/3d-printing-and-sustainability/)

[Options for rapid fabrication with 3D printing](http://make4all.org/portfolio/rapid-fabrication-prototyping/)
]

---
## Other Materials

- [Lisa Harouni Talk](https://www.ted.com/talks/lisa_harouni_a_primer_on_3d_printing#t-120717) (@2:12)
- [Powder printer](https://youtu.be/kBHsfNDsbCs?t=29s)
- [Liquid Based additive printers](https://www.popsci.com/new-liquid-based-3d-printer-takes-minutes-not-hours/) (@1:07)
- [Candy](https://www.youtube.com/watch?time_continue=5&v=rU6RAM0Wrck&feature=emb_logo),
[Chocolate](http://youtu.be/BIFi8but3Vw) other [Confections](https://www.youtube.com/watch?v=U3TmrCzVZ6w)
- [Pancake bot](https://www.youtube.com/watch?v=f3Q8nbtRNT0)
- Cement for houses [old](https://www.youtube.com/watch?v=WzmCnzA7hnE), [new](https://www.youtube.com/watch?v=8zt_3Gs1ksg)
- [MIT’s glass printer](https://gizmodo.com/watching-mits-glass-3d-printer-is-absolutely-mesmerizin-1725433454)
- [Ceramics](https://www.youtube.com/watch?v=1JjaqKUUMMw) (with sound vibrations), [Sample art](https://www.foransuon.com/)

---
## Printing: Beyond plastic

.left-column50[
![:img Model for embedding a nut and bolt in a print, 50%, width](img/3dprinting/embedding.png)
![:img Fabric taped down and embedded, 70%, width](img/3dprinting/fabric.png)
![:img Fabric attached through holes, 50%, width](img/3dprinting/fabric2.png)

]

.right-column50[
![:img Shorey designs embedded metal, 40%, width](img/3dprinting/metal-embed.jpg)  
![:img Shorey designs dragon scales, 40%, width](https://images.squarespace-cdn.com/content/v1/5cf88c7cc74fa800012045db/1559817320037-GI8H3Y56L8W087DD9CDG/ke17ZwdGBToddI8pDm48kLxnK526YWAH1qleWz-y7AFZw-zPPgdn4jUwVcJE1ZvWEtT5uBSRWt4vQZAgTJucoTqqXjS3CfNDSuuf31e0tVH-2yKxPTYak0SCdSGNKw8A2bnS_B4YtvNSBisDMT-TGt1lH3P2bFZvTItROhWrBJ0/aaezgif.com-video-to-gif.gif?format=1000w)

[Shorey Designs](https://www.shoreydesigns.com/3d-printing-on-fabric)

]
---
## Printing with Kinetics

.left-column-half[
![:img Picture of tendon that can be used to bend something, 80%, width](img/3dprinting/tendon1.png)
![:img Picture of tendon that has been used to bend something, 80%, width](img/3dprinting/tendon2.png)
]
.right-column-half[
![:youtube Examples of embedded fabric, 9xqze9csLmY]
]
???
- String or wire (like a tendon)

---
## Printing new interactions

---
## More examples!

<br>
- [3D Printed Medical Device Saves Baby's Life](https://www.youtube.com/watch?v=zr0HGCZSgE4)
- [Prosthetic hand](http://youtu.be/CHPuMCshkLU?t=42s) (up to ~2:10)
- [Prostheic 3D printed Eagle Beak](https://youtu.be/M1jxnogZgd4)
- [3D printed car](https://www.youtube.com/watch?v=daioWlkH7ZI)
- [Lots of examples quickly](https://www.youtube.com/watch?v=X5AZzOw7FwA)
- [3D printers print ten houses in 24 hours](https://www.youtube.com/watch?v=SObzNdyRTBs)
- [Printed body parts](http://youtu.be/jSjW-EgKOhk?t=1m8s)
- [Printed organs](https://www.youtube.com/watch?v=4nqw1yjyKEs)
- [3D printed pizza](http://youtu.be/dvjqmMfMU7w?t=15s)
- [3D printed fashion](http://youtu.be/63Xozzh_uHM)
- [3D Printing a Garden Sprinkler](https://www.youtube.com/watch?v=y9XRD3P2G-E)

---
class: center, middle, inverse
# Laser  Cutting
---
## Example: Bagholder

.left-column[
![:img A handle with hooks below it to make it more comfortable to hold a bag , 100%, width](img/3dprinting/laser-bagholder.png)
]
.right-column[
[Instructables project](https://www.instructables.com/Making-a-laser-cut-bag-holder/)

Examples In Tinkercad: [1](https://www.tinkercad.com/things/iR1ogjaD0a9) [2](https://www.tinkercad.com/things/lhLixGNHxFe-bag-holder) [3](https://www.tinkercad.com/things/8Cu8NS0Ws2n) [4](https://www.tinkercad.com/things/3gfeTggL15I) [5](https://www.tinkercad.com/things/h9xkhbg6dgE) [6](https://www.tinkercad.com/things/6OoyVYTHOU4)
How could you modify this to make it more comfortable?

]

---
## Example: Book Opener ([Etsy](https://www.etsy.com/listing/883330413/book-buddy-book-holder-wood-thumb-page))

.left-column50[![:img Wooden items decoratively shaped but all relatively wide and flat with a finger hole for holding a book open, 80%, width](img/3dprinting/laser-bookopener.png)]
.right-column50[
Example In Tinkercad: [1](https://www.tinkercad.com/things/a5riyLRKUBU)
]
---
## Example: Cup Holder ([T:1863196](https://www.thingiverse.com/thing:1863196))

![:img A ring that fits a cup with two holes to attach a string and hang it around ones neck, 50%, width](img/3dprinting/laser-hanging-cupholder.png)

---
## Example: Key Guard ([T:1365497](https://www.thingiverse.com/thing:1365497))

![:img A flat rectangle with a few inner shapes to make it easier to press keys in known locations, 50%, width](img/3dprinting/laser-keyguard.png)

---
## Example: Bottle Opener ([T:40131](https://www.thingiverse.com/thing:40131))

![:img A keyhole-shaped object with a semicircle of teeth at top that can grasp a bottle lid and handles that can be pressed together to apply leverage to the teeth and turn, 40%, width](img/3dprinting/laser-bottle-opener.png)
Example in Tinkercad: [1](https://www.tinkercad.com/things/9SmzdtgJ9Ou) [2](https://www.tinkercad.com/things/gt2P9U1njre) [3](https://www.tinkercad.com/things/kUCNz3pnKIG) [4](https://www.tinkercad.com/things/l7ol57fDvi3) [5](https://www.tinkercad.com/things/lbPdLUKzzoP)

---
## Example: Key Handle ([T:2802082](https://www.thingiverse.com/thing:2802082))

.left-column50[
![:img A flat item with an opening shaped to hold a door key so as to make it easier to grasp and turn, 100%, width](img/3dprinting/laser-keyhandle.png)
]
.right-column50[
How would you attach this securely?
]

---
## Example: Pillbox ([Etsy](https://www.etsy.com/listing/1321874671/laser-cut-3-or-4-mm-18-inch-svg-7-days?ga_order=most_relevant&ga_search_type=all&ga_view_type=gallery&ga_search_query=laser+cut+pill&ref=sr_gallery-1-6&organic_search_click=1))
.left-column50[
![:img A box with weekday labels broken into sections for each day that can hold pills, 80%, width](img/3dprinting/laser-pillbox.png)
]
.right-column50[
Probably made with [boxes.py](https://www.instructables.com/Lasercut-Little-Wood-Boxes/)
![:img Pictures of laser cut boxes, 80%, width](img/3dprinting/laser-boxes.png)
]

---
## Example: Cutting Board ([rehab-store.com](https://www.rehab-store.com/p-one-handed-deluxe-maple-cutting-board.html))

![:img A cutting board with nails and ridges to make it easier for someone with lower hand dexterity to cut, 35%, width](img/3dprinting/laser-cutting.jpeg) Examples in Tinkercad: [1](https://www.tinkercad.com/things/iWToRbHgluC) [2](https://www.tinkercad.com/things/eDCKLmKA0MA)

---
## Example: Keyboard Risers ([Amazon](https://www.amazon.com/SUPBEE-Laptop-Computer-Keyboard-Pockets/dp/B0B21VHY57))

![:img Wedges for changing the angle of a keyboard for accessibility, 35%, width](img/3dprinting/laser-supbee-keyboard.jpg)

---
## Next steps

- Now it's time to think about what you might want to make
- Talk to your neighbor

---
## Some key things to know about Laser Cutting

We're using a [Glowforge](https://glowforge.com/). 
- It takes SVGs as input
- It can engrave, cut, etc
- We're providing plywood, 3mm thick [double check with calipers]
- We will not engrave during lab, it slows things down too much, but we may cut

---
## What can you do?

.left-column40[
![:img Illustration of cutting scoring and engraving first with those words and then with stars. Cutting cuts a hole; Scoring outlines something; and Engraving burns it into the wood, 70%, width](img/3dprinting/laser-Cut-Score-Engrave.png)
]
.right-column60[
- Cutting: Makes a hole: Any line can be cut
- Scoring: Doesn't cut all the way through: Again, any line. Use a different color
- Engraving: Burns. Can do greyscale.
  - Images.  Make sure they're not too dark. 
  - Add in a drawing program after Tinkercad
]

---
## How we will create SVGS

First create a design in TinkerCAD (or other CAD or 2D design software if you know it well). 
- You should group everything together that is touching
- Place it carefully. The base plane will determine what is part of the final SVG
- We will not engrave during lab, it slows things down too much, but we may cut
- Export it as SVG (demo)
   - Include mm as units
- Re-export *with images emedded* if you add them

---
## Your process

.left-column50[
Measure thrice

Make an svg

Print it on paper

Cut it out and check your measurements AGAIN
]
.right-column50[
Decorate
]

---
## Example: My bag holder

![:img Screenshot of a bagholder in tinkercad titled Mankoff Bag Hanger - V1, 30%, width](img/3dprinting/bagholder-tinkercad.png)

---
## First print: On Paper

![:img Initial design printed on paper is about the size of a single finger, 30%, width](img/3dprinting/tiny.jpg)

---
## Measuring

![:img Calipers stretch the width of four fingers and show a measurement of about 76mm , 30%, width](img/3dprinting/measuring.jpg)

---
## Other Important Measurements

The amount of wood removed by the laser cutter as it burns through the wood.

Should always test for each new type of wood and wood thickness

[Instructable](https://www.instructables.com/How-to-Adjust-for-Wood-Thickness-and-Kerf-on-a-Las/) on how to do this

Only an issue if you're making a box or something else that has to assemble

Use calipers to measure!

---
## Reprinted on paper

Reason? I used 76mm for the *outer* dimension instead of the *inner* one!
![:img Another print on paper is still too small, 30%, width](img/3dprinting/measurement-error.jpg)

---
## Final print

Do you see the problem with this design?<BR>
![:img A laser cut bag holder big enough for a hand!, 30%, width](img/3dprinting/first-print.jpg)

---
## The End!

---
## Other software options

[Adobe Illustrator](https://www.adobe.com/products/illustrator.html). Best for most tasks if you have it

[AutoCAD](https://www.autodesk.com/products/autocad/overview?term=1-YEAR&tab=subscription) (free for students). Probably overkill

[Inkscape](https://www.autodesk.com/products/autocad/overview?term=1-YEAR&tab=subscription) (free). Best free option

---
background-image: url(img/people.png)

.left-column50[
# Welcome to the Future of Access Technologies

Week N, FOOBAR

CSE443, Winter 2026
]
---
name: normal
layout: true
class:

---
# Important Reminder

.left-column[
![:qrhere](nil)]

## Make sure zoom is running and recording!!!
## Check on zoom buddies
## Make sure captioning is turned on

---
[//]: # (Outline Slide)
# Learning Goals for today

---
# In-class build exercise…

We will make something blink!!

---
# Preparation

Distribute Arduinos and parts…

If you haven’t downloaded and installed the Arduino IDE, drivers (for Macs only), do that now while we are getting parts distributed. See the  AdaFruit website BlueFruit page
If you are on a mac, you will additionally need to install the USB to UART bridge drivers provided by Silabs
By Wednesday you will also need the Bluefruit LE Connect app, and here is the AdaFruit website describing how to install that

Your circuitry kits are from amazon: https://smile.amazon.com/gp/product/B01EROKLBC

---
# Solderless Breadboard

.left-column[
![:img A picture of a breadboard, 100%, width](img/physical/breadboard.png)

]
.right-column[
Allows you to quickly make electrical connections by pressing wires into holes
]
---
# Solderless Breadboard

.left-column[
![:img A picture of a breadboard with wires acrsoss rows, 100%, width](img/physical/breadboard2.png)

]
.right-column[
Allows you to quickly make electrical connections by pressing wires into holes

Central rows of holes are connected like this
```
A1 is connected to 
B1, C1, D1, and E1
F1 is connected to 
G1, H1, I1 and J1
Etc. for rows 2…63
```
]

---
# Solderless Breadboard

.left-column[
![:img A picture of a breadboard with wires down power and ground, 100%, width](img/physical/breadboard3.png)

]
.right-column[
Allows you to quickly make electrical connections by pressing wires into holes

Side columns (‘bus’) (typically for power) are connected like this

]

---
# Step 1: Connect Power Bus Sides

.left-column[
![:img A picture of a breadboard with the two sides of power and ground connected, 100%, width](img/physical/breadboard4.png)

]
.right-column[
Connect Red to Red and Blue to Blue at the bottom (using red & black wires from kit)

Double check that it’s Red to Red and Blue to Blue (!)
]

---
# Step 2: Arduino into breadboard

.left-column[
![:img A picture of a breadboard with arduino added, 100%, width](img/physical/breadboard5.png)

]
.right-column[
Arduino is about in the center of the breadboard (just to the left) at low numbered end, with USB connecter towards the outside (top)

Check: You should see “a b”  and  “j”  at the top and pins in rows 1…16
]

---
# Test

Plug the USB cable between computer and Arduino

Should see a bright blue or green (power) LED
 on constantly, indicating we are powered
and red LED should flash once per second
a “blink” test program already loaded (will be replaced)

Side note: Computer should recognize device
May need to install drivers if you haven’t already (Macs). Not necessary today.

---
# Step 2: Power from Arduino

.left-column[
![:img A picture of a breadboard with power circled, 100%, width](img/physical/breadboard6.png)

]
.right-column[
For this project, USB is powering Arduino, Arduino is powering the rest of the circuit

Connect Arduino GND pin
]
---
# Step 3a: Power from Arduino

.left-column[
![:img A picture of a breadboard with a wire from a4 to ground, 100%, width](img/physical/breadboard7.png)

]
.right-column[
For this project, USB is powering Arduino, Arduino is powering the rest of the circuit

Connect Arduino GND pin

Can do this from a4 because breadboard ground pin is plugged into row 4
]

---
# Step 3b: Power from Arduino

.left-column[
![:img A picture of a breadboard with a wire from a2 to power, 100%, width](img/physical/breadboard8.png)

]
.right-column[
Now connect Arduino 3V to power using a red wire (A2 to power bus)

At this point, power and ground are connected in both buses. All further wiring will take place in the f-j columns if not specified.
]

---
# Note

This part of the wiring will be used for the rest of your projects in this class, so leave it in place after you are done with this build

---
# What is in your [Kit?](https://www.amazon.com/SunFounder-Electronics-breadboard-Resistor-Raspberry/dp/B07QT78FXF/ref=sr_1_9)

![:img Kit contents include resistors, leds, diodes, capacitors, transistors, thermistors, a buzzer, servo, lcd display and more, 100%, width](img/physical/kit-contents.jpg)

TODO: finalize kit. Considering [seeed](https://www.seeedstudio.com/Seeed-XIAO-BLE-nRF52840-p-5201.html?gclid=CjwKCAjw8-OhBhB5EiwADyoY1a8K4v1cJxiLIgz-Sbs9VeUn85knaTEDPpocYsO-Xt7SOcKo51SkbBoC-I4QAvD_BwE) and which board? [nano 33ble](https://www.amazon.com/Arduino-Nano-33-BLE/dp/B07WV59YTZ?source=ps-sl-shoppingads-lpcontext&ref_=fplfs&psc=1&smid=AA57DDZKZUZDL) or [nano 33 iot](https://www.amazon.com/Arduino-Nano-33-IoT/dp/B07VW9TSKD?source=ps-sl-shoppingads-lpcontext&ref_=fplfs&psc=1&smid=AA57DDZKZUZDL)

---

---
# Step 4: Current Limiting Resistors

.left-column[
![:img A picture of a breadboard with resistors added, 100%, width](img/physical/breadboard9.png)

]
.right-column[
Find 2 220Ω resistors
![:img A picture of a resistor with two red, a brown and a yellow stripe, 100%, width](img/physical/resistor.png)

Unplug Arduino while wiring!
Connect resistors
J9-J19
H24 to ground

[Wikipedia article on color codes](https://en.wikipedia.org/wiki/Electronic_color_code)
]

---

TODO finish this deck from [here](https://drive.google.com/drive/folders/1NA1ajSwodJy6g9jDeMe1QLLflgE9_dnl)

---
class: middle, center, inverse
# Physical Computing

---
# Phone as embedded computer
.right-column60[

Tactile map for the blind

![:img An interactive map with 6 black conductive touchpoints. The map
is held in a case with 6 conductive buttons that houses a Samsung Note
2 with a 5.5-inch screen., 40%, width](img/3dprinting/tactile-map.png)

]

.left-column40[
Phone as embedded computer
- Better solution because reprinting a map is faster than making a whole new portable map for each region
- Similar to new interaction techniques, uses conductive plastic
]

---
# Adding in physical computing
.right-column60[

C. Lee, [Intellisplash](https://www.christopherslee.org/home/cadiot#h.pstiqwwsc6zp) water purity tester

![:img Intellisplash water purity tester by Christopher Lee - SVP 2015, 40%, width](img/3dprinting/intellisplash.png)

]
.left-column40[
Combination of microcontroller, 3d printing, and phone

Uses WiFi, Bluetooth and other communication protocols

]
---
# Other Sensing Adaptations
.right-column60[
![:img (a) 3D printed smartphone adaptor designed for the Samsung
Galaxy Note II with a black ABS dark box comprising slots for
droppers. (b) 3D printed cartridge composed of a white ABS piece
comprising 4 wells and BL substrate reservoirs and a black sliding lid
with transparent ABS windows. (c) The assembled smartphone-based
device with running the specifically designed application for BL
signal acquisition and analysis., 60%, width](img/3dprinting/biotoxicity.jpg)

]
.left-column40[
[Biotoxicity
sensing](https://www.sciencedirect.com/science/article/pii/S0925400515305992)

Dark box

Phone case

Many similar options -- e.g. [Ph
Meter](https://ieeexplore.ieee.org/abstract/document/6916991);
[Sensing sweat
make-up](https://pubs.rsc.org/en/content/articlehtml/2014/an/c4an01612b);
[Nanosensing by
Nasa](https://www.nasa.gov/centers/ames/news/features/2009/cell_phone_sensors.html)
[more examples](https://www.sciencedirect.com/science/article/pii/S0167779914000572)
]

???
 By clicking the “start” button (b) the application runs and several
  tabs can be selected (c). The “Procedure” box (d) provide to the
  user the instructions to perform the assay, then the Begin button
  allow to proceed to the “Checklist” box (e) where preset timers
  guide the user through the correct incubation times before BL image
  acquisition. The instructions can be also eluded by selecting “Test
  sample” in the home page, which jumps the user directly to the
  checklist. At the end of the countdown the smartphone camera is
  activated and the user can simply touch the “Acquire” button to
  capture the BL image of both the test and control wells. (f) The
  acquired images are rapidly analyzed on the smartphone and the
  sample toxicity result is displayed as “Cell viability” value and a
  warning message (Safe, Harmful, Highly toxic). BL image and results
  can be also saved for downstream application (i.e. sending results
  to a central laboratory).

---
# Printing to enhance a mobile phone

.right-column60[
![:youtube Printed objects whose use can be sensed, W1V2AgDbgTQ]
]
.left-column40[
Printed Analytics: Sensing prosthetic device use
- Uses backscatter technology
- Works in range of a modified wireless router
]

---
# Summary

What does physical computing offer us?

.left-column-half[
New ways to interact
- capacitive sensing facilitate by conductive plastic/thread
- microphone + machine learning

New ways to sense information
- fluid properties
- audio
- backscatter
]
.right-column-half[
New ways to combine devices (e.g. through bluetooth sensing of physical hardware)

Benefits:
- modify a device beyond what the manufacturer expected
- rapid prototyping of novel solutions
]

---
# In-class build exercise…

We will make something blink!!

---
# Preparation

Distribute Arduinos and parts…

Your circuitry kits are from amazon: https://smile.amazon.com/gp/product/B01EROKLBC

---
# Solderless Breadboard

.left-column[
![:img A picture of a breadboard, 100%, width](img/physical/breadboard.png)

]
.right-column[
Allows you to quickly make electrical connections by pressing wires into holes
]
---
# Solderless Breadboard

.left-column[
![:img A picture of a breadboard with wires acrsoss rows, 100%, width](img/physical/breadboard2.png)

]
.right-column[
Allows you to quickly make electrical connections by pressing wires into holes

Central rows of holes are connected like this
```
A1 is connected to 
B1, C1, D1, and E1
F1 is connected to 
G1, H1, I1 and J1
Etc. for rows 2…63
```
]

---
# Solderless Breadboard

.left-column[
![:img A picture of a breadboard with wires down power and ground, 100%, width](img/physical/breadboard3.png)

]
.right-column[
Allows you to quickly make electrical connections by pressing wires into holes

Side columns (‘bus’) (typically for power) are connected like this

]

---
# Step 1: Connect Power Bus Sides

.left-column[
![:img A picture of a breadboard with the two sides of power and ground connected, 100%, width](img/physical/breadboard4.png)

]
.right-column[
Connect Red to Red and Blue to Blue at the bottom (using red & black wires from kit)

Double check that it’s Red to Red and Blue to Blue (!)
]

---
# Step 2: Arduino into breadboard

.left-column[
![:img A picture of a breadboard with arduino added, 100%, width](img/physical/breadboard5.png)

]
.right-column[
Arduino is about in the center of the breadboard (just to the left) at low numbered end, with USB connecter towards the outside (top)

Check: You should see “a b”  and  “j”  at the top and pins in rows 1…16
]

---
# Test

Plug the USB cable between computer and Arduino

Should see a bright blue or green (power) LED
 on constantly, indicating we are powered
and red LED should flash once per second
a “blink” test program already loaded (will be replaced)

Side note: Computer should recognize device
May need to install drivers if you haven’t already (Macs). Not necessary today.

---
# Step 2: Power from Arduino

.left-column[
![:img A picture of a breadboard with power circled, 100%, width](img/physical/breadboard6.png)

]
.right-column[
For this project, USB is powering Arduino, Arduino is powering the rest of the circuit

Connect Arduino GND pin
]
---
# Step 3a: Power from Arduino

.left-column[
![:img A picture of a breadboard with a wire from a4 to ground, 100%, width](img/physical/breadboard7.png)

]
.right-column[
For this project, USB is powering Arduino, Arduino is powering the rest of the circuit

Connect Arduino GND pin

Can do this from a4 because breadboard ground pin is plugged into row 4
]

---
# Step 3b: Power from Arduino

.left-column[
![:img A picture of a breadboard with a wire from a2 to power, 100%, width](img/physical/breadboard8.png)

]
.right-column[
Now connect Arduino 3V to power using a red wire (A2 to power bus)

At this point, power and ground are connected in both buses. All further wiring will take place in the f-j columns if not specified.
]

---
# Note

This part of the wiring will be used for the rest of your projects in this class, so leave it in place after you are done with this build

---
# What is in your [Kit?](https://www.amazon.com/SunFounder-Electronics-breadboard-Resistor-Raspberry/dp/B07QT78FXF/ref=sr_1_9)

![:img Kit contents include resistors, leds, diodes, capacitors, transistors, thermistors, a buzzer, servo, lcd display and more, 100%, width](img/physical/kit-contents.jpg)

---

---
# Step 4: Current Limiting Resistors

.left-column[
![:img A picture of a breadboard with resistors added, 100%, width](img/physical/breadboard9.png)

]
.right-column[
Find 2 220Ω resistors
![:img A picture of a resistor with two red, a brown and a yellow stripe, 100%, width](img/physical/resistor.png)

Unplug Arduino while wiring!
Connect resistors
J9-J19
H24 to ground

[Wikipedia article on color codes](https://en.wikipedia.org/wiki/Electronic_color_code)
]

---

TODO finish this deck from [here](https://drive.google.com/drive/folders/1NA1ajSwodJy6g9jDeMe1QLLflgE9_dnl)