https://github.com/jonitrythall/minisvgworkshop
A mini workshop based on my GDI class: Intro to Writing SVG
https://github.com/jonitrythall/minisvgworkshop
Last synced: 4 months ago
JSON representation
A mini workshop based on my GDI class: Intro to Writing SVG
- Host: GitHub
- URL: https://github.com/jonitrythall/minisvgworkshop
- Owner: jonitrythall
- License: other
- Created: 2016-12-04T18:19:51.000Z (over 8 years ago)
- Default Branch: master
- Last Pushed: 2016-12-09T23:48:12.000Z (over 8 years ago)
- Last Synced: 2024-12-27T11:24:57.093Z (6 months ago)
- Size: 9.77 KB
- Stars: 2
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Intro To Writing SVG Workshop, Mini
Slides, curriculum notes, and recources for an in person 1 hour workshop for adults based on [Pocket Guide to Writing SVG](http://svgpocketguide.com/book/).
The full 2.5 hour course materials [can be found here](https://github.com/jonitrythall/svgworkshop).
**Title**: Mini Intro To Writing SVG
**Grade Level**: Adult
**Experience Level**: Beginner
**Total Time**: 1 hour
**Curriculum**: Based on the book [Pocket Guide to Writing SVG](http://svgpocketguide.com/book/) by Joni Trythall
**Objective**: By the end of this workshop students will have a foundational understanding of SVG syntax and the benefits of using it this way over alternative approaches, such as an `img`. Base CodePen demos with instructions allow everyone to get started right away writing and editing basic SVG shapes in the browser. Students will also learn how to edit the code of more complex graphics, like grapes.
**Topics Covered**: What SVG is, why SVG is awesome, syntax, document organization, writing basic shapes, editing complex graphics in the browser
**Presentation Format**: slides, CodePen demos, hands-on building
**Materials**: Computers, CodePen, Chrome (pre-installed), [CodePen demos](http://codepen.io/collection/DVYpJK/), [reference site](http://jonitrythall.github.io/svgintro/), [slides](https://docs.google.com/presentation/d/1Lyn7tbcdFzygksPpH25ru8F6daJSyGetbexMR-Ru3P4/edit?usp=sharing), [Pocket Guide to Writing SVG](http://svgpocketguide.com/book/)
**Prerequisites**: Basic HTML/CSS