diff --git a/dev.sh b/dev.sh new file mode 100644 index 0000000..f58a789 --- /dev/null +++ b/dev.sh @@ -0,0 +1,7 @@ +docker run --rm \ + -v $(pwd)/docs/slides:/reveal/docs/slides \ + -v $(pwd)/scripts/test:/resources \ + -v $(pwd)/images:/reveal/images \ + -e TITLE='my Title' -e THEME_CSS='cloudogu-black.css' \ + -p 8000:8000 -p 35729:35729 \ + cloudogu/reveal.js:dev \ No newline at end of file diff --git a/docs/slides/00-title.md b/docs/slides/00-title.md new file mode 100644 index 0000000..29e631b --- /dev/null +++ b/docs/slides/00-title.md @@ -0,0 +1,20 @@ + + +
+ +

+ // + Video Editing Basics +

+
+ +**Joao Figueiredo** + +LCD Porto + +
+ +
+June 2025, LCD Porto + +
diff --git a/docs/slides/01-me-me-me.md b/docs/slides/01-me-me-me.md new file mode 100644 index 0000000..e95a628 --- /dev/null +++ b/docs/slides/01-me-me-me.md @@ -0,0 +1,11 @@ + + +## Me, me, me! + +# Joao figueiredo + +Father of three, cat porter, dog walker, ops tech manager and infinitely curious, mainly for programming, web technologies and electronics. + +### coordinator @ LCD Porto + +Operational Technology Manager @ Mota-Engil \ No newline at end of file diff --git a/docs/slides/02-lcd.md b/docs/slides/02-lcd.md new file mode 100644 index 0000000..eec86f6 --- /dev/null +++ b/docs/slides/02-lcd.md @@ -0,0 +1,11 @@ + + +# LCD Porto + +LCD Porto is a community of makers, hackers, and tinkerers in Porto, Portugal. We focus on sharing knowledge and skills in various fields, including electronics, programming, and web technologies. + +It's a space where creativity meets technology, fostering innovation and collaboration among its members. + +* * * + +A project of Audiência Zero, a non-profit association dedicated to promoting education, knowledge sharing, , community engagement, social innovation, and civic participation. \ No newline at end of file diff --git a/docs/slides/10-outline.md b/docs/slides/10-outline.md new file mode 100644 index 0000000..612eb9c --- /dev/null +++ b/docs/slides/10-outline.md @@ -0,0 +1,15 @@ +# Outline + +Theory: 5 Key Rules + +1. Continuity Editing +1. 180‑Degree Rule +1. J‑ & L‑Cuts +1. Pacing & Rhythm +1. Clean Audio + +Note: +- Briefly introduce the 5 key rules of video editing. +- Explain that these rules will be covered in detail in the following slides. +- Ask participants why they opted to attend this workshop +- Ask what kind of video editing they are interested in diff --git a/docs/slides/15-software.md b/docs/slides/15-software.md new file mode 100644 index 0000000..483ad36 --- /dev/null +++ b/docs/slides/15-software.md @@ -0,0 +1,9 @@ +## But first.... + +# Required Software +This workshop will use the following software: +- **Kdenlive**: Video editor that is user-friendly and powerful. +- **Audacity**: Audio editor for cleaning up and enhancing audio tracks. + +

+Open source software rules! \ No newline at end of file diff --git a/docs/slides/20-continuity.md b/docs/slides/20-continuity.md new file mode 100644 index 0000000..1664670 --- /dev/null +++ b/docs/slides/20-continuity.md @@ -0,0 +1,62 @@ + +# Continuity Editing + +> Make each cut feel like uninterrupted time & space. The audience should forget the camera exists. + +Note: +Reinforce that continuity is about psychological comfort; when it's invisible the viewer stays focused on story, not technique. + +-- + +Continuity Editing +#### 1. Match on Action + +A cut during continuous physical movement (e.g., a door opening) hides the edit. + +* Cut at peak motion so momentum sells the splice. +* Action should overlap a few frames across both shots for seamless flow. + +Note: +Demonstrate with a two‑camera sample: actor sits, use a clap for sync and cut mid‑sit. + +-- + +Continuity Editing +#### 2. Eyeline Match + +Maintain where a subject looks so the viewer can orient spatial relationships. + +* Shot A: interviewer asks, eyes \~10° left of lens. +* Shot B: guest answers, eyes \~10° right of lens. + +Note: +Ask the class what happens if we flip shot B horizontally; show the resulting confusion. + +-- + +Continuity Editing +#### 3. Screen Direction + +Keep left‑to‑right (↔) travel consistent unless you show an explicit reversal. + +* Insert a neutral axis shot before reversing direction. +* Works in tandem with the 180‑degree rule to anchor geography. + +Note: +Draw arrows on the whiteboard; relate to driving footage where the car suddenly appears to go backwards if screen direction flips. + +-- + +Continuity Editing +#### Continuity Checklist + +| Area | Watch For | +|--- |--- | +| Action | Movement overlap, no jump stutter | +| Eyeline | Correct sight‑lines across axis | +| Direction | Consistent L↔R travel | +| Props & Wardrobe | No sudden changes | +| Lighting | No time‑of‑day jumps | + +Note: +Encourage participants to toggle clip visibility in Kdenlive and watch each cut back‑to‑back before exporting the final cut. diff --git a/docs/slides/30-180-degree.md b/docs/slides/30-180-degree.md new file mode 100644 index 0000000..7b1cad2 --- /dev/null +++ b/docs/slides/30-180-degree.md @@ -0,0 +1,58 @@ +### 180‑Degree Rule + +> The camera must stay on one side of an imaginary line (the **axis of action**) so that left and right remain consistent for the viewer. + +> This is not The Matrix, you are not one of the Wachowskis. + +Note: +Introduce the idea of spatial grammar; viewers build a mental map within seconds. Violating it breaks immersion. + + +-- +180‑Degree Rule +Illustration of the action axis with safe camera positions + +-- + +180‑Degree Rule +#### The Axis of Action + +* Subject A always screen‑left, Subject B screen‑right. +* Any camera placed within the 180° arc keeps this orientation. + +Note: +Point to coloured semicircle on slide—explain that this is the camera's “safe zone.” + +-- + +#### What Happens If You Cross? + +* Subjects swap screen sides → confusion. +* Eyelines no longer match → broken eye contact. +* Movement direction reverses (car appears to turn around). + +Note: +Play a 5‑second clip of a conversation where one shot accidentally crosses; ask the room what feels “wrong.” + +-- + +#### Three Ways to Cross Cleanly + +1. **Neutral (on‑line) shot** – cut to a shot that sits directly on the axis, then to the new side. +2. **Visible camera move** – dolly/pan across the line within a single shot. +3. **Subject movement** – have the actor walk across the axis; cut once they’ve settled on the other side. + +Note: +Emphasise that each method gives the audience a visual “ticket” allowing the flip. + +-- + +#### Breaking the Rule — Deliberately + +> Rules are guidelines; break them with intent. + +* Fight chaos, dream logic, psychological disorientation. +* Use colour or lighting cues to anchor geography even when L/R flips. + +Note: +Show quick montage from "The Bourne Ultimatum" to illustrate purposeful disorientation. diff --git a/docs/slides/40-jl-cuts.md b/docs/slides/40-jl-cuts.md new file mode 100644 index 0000000..7c06891 --- /dev/null +++ b/docs/slides/40-jl-cuts.md @@ -0,0 +1,67 @@ + +### J & L Cuts – The Invisible Glue + +| Name | What viewer hears first | Emotional effect | +| --------- | ---------------------------- | ------------------------ | +| **J‑Cut** | Audio from **next** scene | Curiosity / anticipation | +| **L‑Cut** | Audio from **current** scene | Continuity / warmth | + +Note: +Use this title slide to remind participants that picture need not dictate structure—audio is often the real storyteller. + +-- + +#### 1. Anatomy of a J‑Cut + +``` +Picture AAAAA|BBBBB +Audio BBBBB +Timeline «——— J ——» +``` + +* The viewer *hears* Scene B before *seeing* it. +* Creates a soft entry; ideal when dialog leads audiences into a new space. + +Note: +Walk the room through the ASCII timeline: top row picture, bottom row audio. Point out the “hook” that pulls us forward. + +-- + +#### 2. Anatomy of an L‑Cut + +``` +Picture AAAAA|BBBBB +Audio AAAAA +Timeline «——— L ——» +``` + +* Scene A’s sound lingers under Scene B visuals. +* Masks jump‑cuts, preserves emotional resonance. + +Note: +Contrast with a hard cut: play a harsh dialog‑to‑B‑roll cut, then the same with an L‑cut to prove smoothness. + +-- + +#### 3. When to Use J/L Cuts + +* **Interviews** – hide camera angle switches, smooth answers over B‑roll. +* **Narrative** – carry a scream or laugh across a reaction shot. +* **Documentary** – lead viewers with ambient sound into the next location. +* **Music videos** – sync lyrical phrases over new imagery. + +Note: +Encourage students to listen for J/L cuts in nightly news pieces—they’re everywhere once you notice. + +-- + +#### 4. Common Pitfalls + +| Issue | Fix | +| ----------------------- | ---------------------------------- | +| Echo / double room‑tone | Cross‑fade or room‑tone bed | +| Spoken word clash | Roll‑back offset; respect pauses | +| Music key change clash | Insert a whoosh SFX or buffer clip | + +Note: +Mention Audacity workflow: you can extend a room‑tone bed to cover the overlap cleanly. diff --git a/docs/slides/50-pacing.md b/docs/slides/50-pacing.md new file mode 100644 index 0000000..5bcf28f --- /dev/null +++ b/docs/slides/50-pacing.md @@ -0,0 +1,51 @@ +### Pacing & Rhythm + +> Editing is choreography: every cut should land on a beat, whether visual or aural. + +Note: +Open by clapping a simple 4‑beat rhythm and asking participants to nod when they *feel* the right moment for the next cut. + +-- + +Pacing & Rhythm +#### 1. Shot Length & Emotion + +| Shot Duration | Typical Feel | +| -------------- | -------------------------------- | +| 1–3 s rapid | Urgency, tension, excitement | +| 4–7 s moderate | Conversational, neutral | +| 8+ s long | Contemplative, dramatic, awkward | + +Note: +Show a compilation: music video (fast), dialogue scene (medium), Tarkovsky clip (long). Ask how mood shifts with duration. + +-- + +Pacing & Rhythm +#### 2. Cut on Action Peaks + +* Slice during *movement apex* (hand lands on table, door slams shut). +* The motion masks the splice—viewer’s eye follows flow, not the edit. + +-- + +Pacing & Rhythm +#### 3. Cut on Dialog Beats + +* Trim silences that don’t serve story. +* Let reaction shots *finish* a spoken sentence; avoid stepping on final syllables. + +-- + +Pacing & Rhythm +#### 4. Rhythm Devices + +| Device | Purpose | +| ------------------- | -------------------------------------- | +| **L‑cut music bed** | Glide pace across scenes | +| **Speed ramp** | Heighten flourish (sports, DIY) | +| **Montage** | Compress time and build energy | +| **Hold frame** | Let emotion breathe, signal importance | + +Note: +Mention Kdenlive’s Time Remap effect: right‑click clip → Add Speed Change → keyframe velocity for ramps. diff --git a/docs/slides/60-audio.md b/docs/slides/60-audio.md new file mode 100644 index 0000000..74ad76b --- /dev/null +++ b/docs/slides/60-audio.md @@ -0,0 +1,70 @@ +Audio +### Clean Audio = Believable Video + +> Viewers forgive shaky images far sooner than noisy sound. + +Note: +Start by playing two identical clips—one with background hiss, one cleaned—and ask which looks “more professional.” + +-- + +Audio +#### 1. Capture at the Source + +* Use the best mic available; position 15–30 cm from mouth. +* Monitor with headphones; peaks should stay below –6 dB. +* Record at least 10 s **room‑tone** in every location. + +Note: +Emphasise that good capture saves hours in post; show how red‑lined peaks distort irreversibly. + +-- + +Audio +#### 2. Room‑Tone & Noise Control (Audacity) + +1. Import clip. +2. Select clean room‑tone → **Effect ▸ Noise Reduction ▸ Get Profile**. +3. Select entire track → repeat Noise Reduction (6–12 dB reduction, Sensitivity 6, Frequency Smoothing 3). +4. Apply **High‑Pass Filter 80 Hz** to remove rumble. + +Note: +Warn that over‑reduction causes “swirly” artefacts—dial Sensitivity down if it sounds robotic. + +-- + +Audio +#### 3. Equalize & Compress + +* Roll off <80 Hz; dip 4 kHz to tame harshness. +* Compressor: Threshold ‑6 dB, Ratio 3:1, Attack 10 ms, Release 150 ms. +* Limit peaks to ‑1 dB; aim for dialogue ≈‑12 LUFS. + +Note: +Show LUFS meter in Kdenlive (View ▸ Audio Meter) and explain web loudness target (‑14 LUFS) versus broadcast (‑23 LUFS). + +-- + +Audio +#### 4. Sync & Layering + +* Align tracks via the **hand‑clap spike** in waveforms. +* Keep voice‑off on dedicated top audio track; ambience/FX below. +* Add 3‑frame fades at every cut to kill pops. + +Note: +Demo Kdenlive’s *Align Audio to Reference* for quick waveform sync—the same tool used in multicam earlier. + +-- + +Audio +#### 5. Export Best Quality + +* Export **WAV 48 kHz 24‑bit** from Audacity. +* In Kdenlive Render: AAC 48 kHz, 192 kb/s (YouTube preset is fine). +* Watch meters during render; ensure no clipping. + +Note: +Clarify that archive masters stay lossless; delivery formats can be lossy. + + diff --git a/docs/slides/99-outro.md b/docs/slides/99-outro.md new file mode 100644 index 0000000..a58aaa7 --- /dev/null +++ b/docs/slides/99-outro.md @@ -0,0 +1,12 @@ + + +# Obrigado! + +## Joao Figueiredo + +### Coordinator @ LCD Porto + +joaofigueiredo@lcdporto.org + + +Thanks to: **ChatGPT o3** \ No newline at end of file diff --git a/images/03-what-is/DSC00505-scaled.webp b/images/03-what-is/DSC00505-scaled.webp new file mode 100644 index 0000000..41208d0 Binary files /dev/null and b/images/03-what-is/DSC00505-scaled.webp differ diff --git a/images/03-what-is/arduino-uno-board-tutorial-beginners2-800x618.jpg b/images/03-what-is/arduino-uno-board-tutorial-beginners2-800x618.jpg new file mode 100644 index 0000000..d715a4a Binary files /dev/null and b/images/03-what-is/arduino-uno-board-tutorial-beginners2-800x618.jpg differ diff --git a/images/03-what-is/openbci.png b/images/03-what-is/openbci.png new file mode 100644 index 0000000..91be861 Binary files /dev/null and b/images/03-what-is/openbci.png differ diff --git a/images/06-mixed-realities/sad_moxie.png b/images/06-mixed-realities/sad_moxie.png new file mode 100644 index 0000000..d2d5212 Binary files /dev/null and b/images/06-mixed-realities/sad_moxie.png differ diff --git a/images/30-180-degree/180-degree-rule.png b/images/30-180-degree/180-degree-rule.png new file mode 100644 index 0000000..9d711fb Binary files /dev/null and b/images/30-180-degree/180-degree-rule.png differ diff --git a/present.sh b/present.sh new file mode 100644 index 0000000..7e604e2 --- /dev/null +++ b/present.sh @@ -0,0 +1,7 @@ +docker run --rm \ + -v $(pwd)/docs/slides:/reveal/docs/slides \ + -v $(pwd)/scripts/test:/resources \ + -v $(pwd)/images:/reveal/images \ + -e TITLE='my Title' -e THEME_CSS='cloudogu-black.css' \ + -p 8080:8080 \ + cloudogu/reveal.js \ No newline at end of file diff --git a/resources/slides.html b/resources/slides.html new file mode 100644 index 0000000..624b681 --- /dev/null +++ b/resources/slides.html @@ -0,0 +1,11 @@ +
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file diff --git a/scripts/test/slides.html b/scripts/test/slides.html new file mode 100644 index 0000000..624b681 --- /dev/null +++ b/scripts/test/slides.html @@ -0,0 +1,11 @@ +
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file