├── README.md ├── Screen.png ├── desktop.jpg ├── green.jpg ├── obs.png ├── scene.png ├── slide.png └── slides ├── requirements.txt └── source ├── example.rst └── index.rst /README.md: -------------------------------------------------------------------------------- 1 | # DIY Virtual Teaching 2 | 3 | This page documents my Ubuntu setup for virtual teaching in Fall 2020. This setup was designed to be pretty minimalistic. I wanted to spend as much time on course material as possible, and make the virtual classes feel casual and interactive. 4 | 5 | I use this setup to teach "Machine Learning Engineering" at Cornell Tech with ~100 students. The course is taught in 3 1-hour sessions: 2 morning / 1 late evening for international student equity. 6 | 7 | 8 | 9 | 10 | ## Constraints 11 | 12 | * Interactive mode. (Many of my colleagues swear by the flipped classroom setting, but I haven't mastered that yet.) 13 | 14 | * My apartment is ~700 sq feet. My partner uses the main room, so I am in the bedroom. I roughly have a 4 foot x 5 foot space. 15 | 16 | 17 | 18 | 19 | * Needed to use my linux desktop (https://system76.com/) for streaming. 20 | 21 | ## Equipment 22 | 23 | I spent roughly $500 on additional equipment for teaching. I am relatively happy with these tools, if I were to spend more it would be on a nicer camera. 24 | 25 | * Snowball Microphone 26 | 27 | * Logitech 1080p Webcam 28 | 29 | * ChromaKey Green Screen (super worth it, highly recommend) 30 | 31 | * Workbench Ring Light (particularly useful for night class) 32 | 33 | * Second monitor (makes it easy to switch streaming scenes) 34 | 35 | * Sony Studio Headphones 36 | 37 | 38 | ## Streaming 39 | 40 | At Cornell Tech, we use Zoom for teaching (and everything else). So I needed to stream through that. 41 | 42 | On my side, I use OBS to stream my class. It seems to be the best tool and FOSS so that's great. 43 | 44 | 45 | 46 | The OBS tools are super easy to use. I was able to create some windows that let me show my terminal (Konsole), webcam, and browser windows (Firefox). I have a couple of different Scene templates that I switch through during class. Everything was intuitive. 47 | 48 | 49 | 50 | ### OBS Setup / Issues 51 | 52 | * In order to use OBS with zoom, I followed the setup instructions here: https://www.eigenmagic.com/2020/04/22/how-to-use-obs-studio-with-zoom/ 53 | 54 | * An alternative approach that works just as well is to create Preview window in OBS and then to share screen that window during class. 55 | 56 | * The XComposite screen share in OBS is quite buggy in Ubuntu. I had to switch from the default desktop to Gnome and use Firefox to get it to work. 57 | 58 | * The default streaming setup was quite low quality. I had to go to Setting->Output to turn it up to something reasonable. 59 | 60 | * In order to use the green screen, you need to add a Chroma filter on the camera output. This works well if you have enough light. The ring light helps with this for my night classes. 61 | 62 | ## Additional Class Software 63 | 64 | * Slido - used to answer questions and comments during class 65 | 66 | * Canvas Quizzes - used to give in class quizzes (mostly for attendance sake) 67 | 68 | * GitHub Classroom - for grading and distribution 69 | 70 | * IPython / Notebooks - useful for in-class code demonstrations and question answering 71 | 72 | * Witeboard - used if I need to draw diagrams on my ipad for technical explanations 73 | 74 | * Affinity Designer - ipad app used to draw class diagrams 75 | 76 | ## Slides 77 | 78 | I decided to try out less technical slides this semester to avoid any resolution issues with streaming. My slides are written using revealjs through the sphinx plugin. There is an example in the slides directory. 79 | 80 | 81 | 82 | 83 | ```bash 84 | cd slides 85 | pip install -r requirements.txt 86 | sphinx-autobuild -b revealjs source/ build/ 87 | ``` 88 | 89 | This will launch the slides at http://localhost:8000/example.html#/ 90 | -------------------------------------------------------------------------------- /Screen.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/srush/VirtualTeaching/89aa7e719ae631413e9488c58c73a47b75b19fbb/Screen.png -------------------------------------------------------------------------------- /desktop.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/srush/VirtualTeaching/89aa7e719ae631413e9488c58c73a47b75b19fbb/desktop.jpg -------------------------------------------------------------------------------- /green.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/srush/VirtualTeaching/89aa7e719ae631413e9488c58c73a47b75b19fbb/green.jpg -------------------------------------------------------------------------------- /obs.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/srush/VirtualTeaching/89aa7e719ae631413e9488c58c73a47b75b19fbb/obs.png -------------------------------------------------------------------------------- /scene.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/srush/VirtualTeaching/89aa7e719ae631413e9488c58c73a47b75b19fbb/scene.png -------------------------------------------------------------------------------- /slide.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/srush/VirtualTeaching/89aa7e719ae631413e9488c58c73a47b75b19fbb/slide.png -------------------------------------------------------------------------------- /slides/requirements.txt: -------------------------------------------------------------------------------- 1 | sphinx 2 | sphinx-autobuild 3 | sphinx-revealjs 4 | 5 | -------------------------------------------------------------------------------- /slides/source/example.rst: -------------------------------------------------------------------------------- 1 | .. raw:: html 2 | 3 | 4 | 5 | 6 | Class Title 7 | ============================= 8 | 9 | 10 | Slide 1 11 | ------- 12 | 13 | * Content 1 14 | 15 | * Content 2 16 | 17 | 18 | Slides 2 19 | ---------- 20 | .. revealjs_slide:: 21 | 22 | 23 | * reveal 1 24 | * reveal 2 25 | 26 | 27 | Slides 3 28 | ---------- 29 | 30 | Some Code :: 31 | 32 | 33 | import numpy as np 34 | np.array(...) 35 | 36 | 37 | 38 | Slides 4 39 | ---------- 40 | 41 | Some math 42 | 43 | .. math:: 44 | 45 | \sum_{i=1}^{10} i * 5 46 | 47 | -------------------------------------------------------------------------------- /slides/source/index.rst: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/srush/VirtualTeaching/89aa7e719ae631413e9488c58c73a47b75b19fbb/slides/source/index.rst --------------------------------------------------------------------------------