ardour/manual
13
0
Fork 0
Code Pull Requests Releases Activity

Update to the Interface Overview page : added the Cue Grid, and updated all visuals. Also, got rid of the imagemaps for <a>s that allow the return of higlighted sections

Browse Source
This commit is contained in:
MrHeadwar 2022-11-03 14:59:21 +01:00 committed by Alexandre Prokoudine
parent 45b92cddd7
commit 88b8130ec8
6 changed files with 180 additions and 87 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

238
include/about-ardours-interface.html
View File

@ -1,97 +1,167 @@
<p>
In Ardour, work is done in two main windows: the <dfn>Editor</dfn> and the
<dfn>Mixer</dfn>. A third view, the <dfn>Recorder</dfn>, is dedicated to
the recording process.
In Ardour, work is done in one of four windows: the <dfn>Editor</dfn>, the
<dfn>Mixer</dfn>, the <dfn>Recorder</dfn>, or the <dfn>Cue Grid</dfn>.
</p>
<figure style="width:100%;">
<img src="/images/editor_map.png" alt="The Editor window" usemap="#editor_map" width="600" height="325">
<map name="editor_map">
<area shape="rect" coords="0,0,336,8" href="@@main-menu" />
<area shape="rect" coords="336,0,600,8" href="@@status-bar" />
<area shape="rect" coords="0,8,68,28" href="@@transport-bar" />
<area shape="rect" coords="68,8,108,28" href="@@selection-and-punch-clocks" />
<area shape="rect" coords="108,8,196,28" href="@@other-toolbar-items#latency-compensation-info" />
<area shape="rect" coords="196,8,228,28" href="@@other-toolbar-items#playhead_options" />
<area shape="rect" coords="228,8,348,28" href="@@transport-clocks" />
<area shape="rect" coords="348,8,368,28" href="@@other-toolbar-items#status_indicators" />
<area shape="rect" coords="368,8,384,28" href="@@other-toolbar-items#monitor_section_info" />
<area shape="rect" coords="384,8,428,28" href="@@selection-and-punch-clocks" />
<area shape="rect" coords="428,8,552,28" href="@@mini-timeline" />
<area shape="rect" coords="552,8,600,28" href="@@other-toolbar-items#mode_selector" />
<area shape="rect" coords="0,28,36,324" href="@@audiomidi-mixer-strips" />
<area shape="rect" coords="36,28,144,36" href="@@toolbox" />
<area shape="rect" coords="144,28,188,36" href="@@grid-controls" />
<area shape="rect" coords="188,28,240,36" href="@@nudge-controls" />
<area shape="rect" coords="516,28,600,36" href="@@zoom-controls" />
<area shape="rect" coords="476,36,600,60" href="@@selection-and-punch-clocks" />
<area shape="rect" coords="476,60,600,324" href="@@editor-lists" />
<area shape="rect" coords="36,36,476,76" href="@@ruler" />
<area shape="rect" coords="36,296,476,324" href="@@summary" />
<area shape="rect" coords="36,76,44,296" href="@@track-and-bus-groups" />
<area shape="rect" coords="44,136,476,156" href="@@audio-track-controls" />
<area shape="rect" coords="44,96,476,136" href="@@midi-track-controls" />
<area shape="rect" coords="44,156,476,176" href="@@automation" />
<area shape="rect" coords="44,176,476,196" href="@@audio-track-controls" />
<area shape="rect" coords="44,196,476,236" href="@@bus-controls" />
<area shape="rect" coords="44,236,476,296" href="@@control-masters-mixer-strips" />
</map>
<img src="/images/mixer_map.png" alt="The Mixer window" usemap="#mixer_map" width="600" height="325">
<map name="mixer_map">
<area shape="rect" coords="0,0,336,8" href="@@main-menu" />
<area shape="rect" coords="336,0,600,8" href="@@status-bar" />
<area shape="rect" coords="0,8,68,28" href="@@transport-bar" />
<area shape="rect" coords="68,8,108,28" href="@@selection-and-punch-clocks" />
<area shape="rect" coords="108,8,196,28" href="@@other-toolbar-items#latency-compensation-info" />
<area shape="rect" coords="196,8,228,28" href="@@other-toolbar-items#playhead_options" />
<area shape="rect" coords="228,8,348,28" href="@@transport-clocks" />
<area shape="rect" coords="348,8,368,28" href="@@other-toolbar-items#status_indicators" />
<area shape="rect" coords="368,8,384,28" href="@@other-toolbar-items#monitor_section_info" />
<area shape="rect" coords="384,8,428,28" href="@@selection-and-punch-clocks" />
<area shape="rect" coords="428,8,552,28" href="@@mini-timeline" />
<area shape="rect" coords="552,8,600,28" href="@@other-toolbar-items#mode_selector" />
<area shape="rect" coords="0,28,121,154" href="@@favorite-plugins-window" />
<area shape="rect" coords="0,154,121,237" href="@@strips-list" />
<area shape="rect" coords="0,237,121,324" href="@@groups-list" />
<area shape="rect" coords="121,28,432,33" href="@@track-and-bus-groups" />
<area shape="rect" coords="514,28,548,324" href="@@master-bus-strip" />
<area shape="rect" coords="548,28,599,324" href="@@monitor-section" />
<area shape="rect" coords="432,28,474,324" href="@@control-masters-mixer-strips" />
<area shape="rect" coords="263,33,333,324" href="@@audiomidi-busses-mixer-strips" />
<area shape="rect" coords="121,33,263,324" href="@@audiomidi-mixer-strips" />
<area shape="rect" coords="474,28,514,324" href="@@foldback-strip" />
<area shape="rect" coords="333,33,343,324" href="@@adding-tracks-busses-and-vcas" />
</map>
<figcaption>
The Editor and Mixer windows. Clicking on a section accesses its
description.
<figure class="imagemap" style="width:100%;">
<img src="/images/editor_map.png" alt="The Editor window" width="900" height="502">
<!-- common -->
<a href="@@main-menu" class="area" style="left: 0px; top: 0px; width: 168px; height: 13px;"></a>
<a href="@@status-bar" class="area" style="left: 746px; top: 0px; width: 154px; height: 13px;"></a>
<a href="@@transport-bar" class="area" style="left: 0px; top: 13px; width: 99px; height: 29px;"></a>
<a href="@@selection-and-punch-clocks" class="area" style="left: 99px; top: 13px; width: 69px; height: 29px;"></a>
<a href="@@other-toolbar-items#latency-compensation-info" class="area" style="left: 168px; top: 13px; width: 69px; height: 29px;"></a>
<a href="@@other-toolbar-items#playhead_options" class="area" style="left: 237px; top: 13px; width: 51px; height: 29px;"></a>
<a href="@@transport-clocks" class="area" style="left: 288px; top: 13px; width: 183px; height: 29px;"></a>
<a href="@@other-toolbar-items#status_indicators" class="area" style="left: 471px; top: 13px; width: 28px; height: 29px;"></a>
<a href="@@other-toolbar-items#monitor_section_info" class="area" style="left: 499px; top: 13px; width: 26px; height: 29px;"></a>
<a href="@@mixing-linear-nonlinear-workflows" class="area" style="left: 525px; top: 13px; width: 42px; height: 29px;"></a>
<a href="@@selection-and-punch-clocks" class="area" style="left: 567px; top: 13px; width: 65px; height: 29px;"></a>
<a href="@@mini-timeline" class="area" style="left: 632px; top: 13px; width: 187px; height: 29px;"></a>
<a href="@@other-toolbar-items#mode_selector" class="area" style="left: 819px; top: 13px; width: 81px; height: 29px;"></a>
<!-- editor -->
<a href="@@toolbox" class="area" style="left: 53px; top: 42px; width: 171px; height: 17px;"></a>
<a href="@@grid-controls" class="area" style="left: 224px; top: 42px; width: 64px; height: 17px;"></a>
<a href="@@nudge-controls" class="area" style="left: 288px; top: 42px; width: 73px; height: 17px;"></a>
<a href="@@zoom-controls" class="area" style="left: 746px; top: 42px; width: 154px; height: 17px;"></a>
<a href="@@ruler" class="area" style="left: 53px; top: 59px; width: 647px; height: 65px;"></a>
<a href="@@editor-lists" class="area" style="left: 746px; top: 59px; width: 154px; height: 442px;"></a>
<a href="@@summary" class="area" style="left: 53px; top: 458px; width: 693px; height: 43px;"></a>
<a href="@@track-and-bus-groups" class="area" style="left: 53px; top: 124px; width: 10px; height: 334px;"></a>
<a href="@@automation" class="area" style="left: 63px; top: 174px; width: 683px; height: 51px;"></a>
<a href="@@control-masters-mixer-strips" class="area" style="left: 63px; top: 410px; width: 683px; height: 48px;"></a>
<a href="@@audio-track-controls" class="area" style="left: 63px; top: 139px; width: 683px; height: 35px;"></a>
<a href="@@midi-track-controls" class="area" style="left: 63px; top: 225px; width: 683px; height: 102px;"></a>
<a href="@@bus-controls" class="area" style="left: 63px; top: 346px; width: 683px; height: 64px;"></a>
<a href="@@bus-controls" class="area" style="left: 63px; top: 124px; width: 683px; height: 15px;"></a>
<a href="@@audio-track-controls" class="area" style="left: 63px; top: 327px; width: 683px; height: 19px;"></a>
<a href="@@audiomidi-mixer-strips" class="area" style="left: 0px; top: 42px; width: 53px; height: 460px;"></a>
<figcaption>
The Editor window. Clicking on a section accesses its description.
</figcaption>
</figure>
<figure class="imagemap" style="width:100%;">
<img src="/images/mixer_map.png" alt="The Mixer window" width="900" height="502">
<!-- common -->
<a href="@@main-menu" class="area" style="left: 0px; top: 0px; width: 168px; height: 13px;"></a>
<a href="@@status-bar" class="area" style="left: 746px; top: 0px; width: 154px; height: 13px;"></a>
<a href="@@transport-bar" class="area" style="left: 0px; top: 13px; width: 99px; height: 29px;"></a>
<a href="@@selection-and-punch-clocks" class="area" style="left: 99px; top: 13px; width: 69px; height: 29px;"></a>
<a href="@@other-toolbar-items#latency-compensation-info" class="area" style="left: 168px; top: 13px; width: 69px; height: 29px;"></a>
<a href="@@other-toolbar-items#playhead_options" class="area" style="left: 237px; top: 13px; width: 51px; height: 29px;"></a>
<a href="@@transport-clocks" class="area" style="left: 288px; top: 13px; width: 183px; height: 29px;"></a>
<a href="@@other-toolbar-items#status_indicators" class="area" style="left: 471px; top: 13px; width: 28px; height: 29px;"></a>
<a href="@@other-toolbar-items#monitor_section_info" class="area" style="left: 499px; top: 13px; width: 26px; height: 29px;"></a>
<a href="@@mixing-linear-nonlinear-workflows" class="area" style="left: 525px; top: 13px; width: 42px; height: 29px;"></a>
<a href="@@selection-and-punch-clocks" class="area" style="left: 567px; top: 13px; width: 65px; height: 29px;"></a>
<a href="@@mini-timeline" class="area" style="left: 632px; top: 13px; width: 187px; height: 29px;"></a>
<a href="@@other-toolbar-items#mode_selector" class="area" style="left: 819px; top: 13px; width: 81px; height: 29px;"></a>
<!-- mixer -->
<a href="@@favorite-plugins-window" class="area" style="left: 0px; top: 42px; width: 118px; height: 149px;"></a>
<a href="@@strips-list" class="area" style="left: 0px; top: 191px; width: 118px; height: 99px;"></a>
<a href="@@groups-list" class="area" style="left: 0px; top: 290px; width: 118px; height: 104px;"></a>
<a href="@@mixer-scenes" class="area" style="left: 0px; top: 394px; width: 118px; height: 107px;"></a>
<a href="@@track-and-bus-groups" class="area" style="left: 118px; top: 42px; width: 521px; height: 11px;"></a>
<a href="@@monitor-section" class="area" style="left: 821px; top: 42px; width: 79px; height: 459px;"></a>
<a href="@@master-bus-strip" class="area" style="left: 769px; top: 42px; width: 52px; height: 459px;"></a>
<a href="@@foldback-strip" class="area" style="left: 711px; top: 42px; width: 58px; height: 459px;"></a>
<a href="@@adding-tracks-busses-and-vcas" class="area" style="left: 691px; top: 42px; width: 20px; height: 459px;"></a>
<a href="@@control-masters-mixer-strips" class="area" style="left: 639px; top: 42px; width: 52px; height: 459px;"></a>
<a href="@@audiomidi-busses-mixer-strips" class="area" style="left: 531px; top: 53px; width: 108px; height: 448px;"></a>
<a href="@@audiomidi-mixer-strips" class="area" style="left: 118px; top: 53px; width: 413px; height: 448px;"></a>
<figcaption>
The Mixer window. Clicking on a section accesses its description.
</figcaption>
</figure>
<figure class="imagemap" style="width:100%;">
<img src="/images/recorder_map.png" alt="The Recorder window" width="900" height="502">
<!-- common -->
<a href="@@main-menu" class="area" style="left: 0px; top: 0px; width: 168px; height: 13px;"></a>
<a href="@@status-bar" class="area" style="left: 746px; top: 0px; width: 154px; height: 13px;"></a>
<a href="@@transport-bar" class="area" style="left: 0px; top: 13px; width: 99px; height: 29px;"></a>
<a href="@@selection-and-punch-clocks" class="area" style="left: 99px; top: 13px; width: 69px; height: 29px;"></a>
<a href="@@other-toolbar-items#latency-compensation-info" class="area" style="left: 168px; top: 13px; width: 69px; height: 29px;"></a>
<a href="@@other-toolbar-items#playhead_options" class="area" style="left: 237px; top: 13px; width: 51px; height: 29px;"></a>
<a href="@@transport-clocks" class="area" style="left: 288px; top: 13px; width: 183px; height: 29px;"></a>
<a href="@@other-toolbar-items#status_indicators" class="area" style="left: 471px; top: 13px; width: 28px; height: 29px;"></a>
<a href="@@other-toolbar-items#monitor_section_info" class="area" style="left: 499px; top: 13px; width: 26px; height: 29px;"></a>
<a href="@@mixing-linear-nonlinear-workflows" class="area" style="left: 525px; top: 13px; width: 42px; height: 29px;"></a>
<a href="@@selection-and-punch-clocks" class="area" style="left: 567px; top: 13px; width: 65px; height: 29px;"></a>
<a href="@@mini-timeline" class="area" style="left: 632px; top: 13px; width: 187px; height: 29px;"></a>
<a href="@@other-toolbar-items#mode_selector" class="area" style="left: 819px; top: 13px; width: 81px; height: 29px;"></a>
<!-- recorder -->
<a href="@@recorder#recorder_last_take_manager" class="area" style="left: 0px; top: 42px; width: 72px; height: 24px;"></a>
<a href="@@recorder#recorder_global_arm" class="area" style="left: 72px; top: 42px; width: 45px; height: 24px;"></a>
<a href="@@recorder#recorder_monitoring_options" class="area" style="left: 117px; top: 42px; width: 53px; height: 24px;"></a>
<a href="@@recorder#recorder_new_playlist" class="area" style="left: 170px; top: 42px; width: 75px; height: 24px;"></a>
<a href="@@recorder#recorder_disk_space" class="area" style="left: 810px; top: 42px; width: 90px; height: 24px;"></a>
<a href="@@recorder#recorder_simplified_session" class="area" style="left: 9px; top: 66px; width: 891px; height: 331px;"></a>
<a href="@@recorder#recorder_global_input_channel" class="area" style="left: 0px; top: 397px; width: 396px; height: 40px;"></a>
<a href="@@track-and-bus-groups" class="area" style="left: 0px; top: 76px; width: 9px; height: 321px;"></a>
<figcaption>
The Recorder window. Clicking on a section accesses its description.
</figcaption>
</figure>
<figure class="imagemap" style="width:100%;">
<img src="/images/cue_map.png" alt="The Cue Grid" width="900" height="502">
<!-- common -->
<a href="@@main-menu" class="area" style="left: 0px; top: 0px; width: 168px; height: 13px;"></a>
<a href="@@status-bar" class="area" style="left: 746px; top: 0px; width: 154px; height: 13px;"></a>
<a href="@@transport-bar" class="area" style="left: 0px; top: 13px; width: 99px; height: 29px;"></a>
<a href="@@selection-and-punch-clocks" class="area" style="left: 99px; top: 13px; width: 69px; height: 29px;"></a>
<a href="@@other-toolbar-items#latency-compensation-info" class="area" style="left: 168px; top: 13px; width: 69px; height: 29px;"></a>
<a href="@@other-toolbar-items#playhead_options" class="area" style="left: 237px; top: 13px; width: 51px; height: 29px;"></a>
<a href="@@transport-clocks" class="area" style="left: 288px; top: 13px; width: 183px; height: 29px;"></a>
<a href="@@other-toolbar-items#status_indicators" class="area" style="left: 471px; top: 13px; width: 28px; height: 29px;"></a>
<a href="@@other-toolbar-items#monitor_section_info" class="area" style="left: 499px; top: 13px; width: 26px; height: 29px;"></a>
<a href="@@mixing-linear-nonlinear-workflows" class="area" style="left: 525px; top: 13px; width: 42px; height: 29px;"></a>
<a href="@@selection-and-punch-clocks" class="area" style="left: 567px; top: 13px; width: 65px; height: 29px;"></a>
<a href="@@mini-timeline" class="area" style="left: 632px; top: 13px; width: 187px; height: 29px;"></a>
<a href="@@other-toolbar-items#mode_selector" class="area" style="left: 819px; top: 13px; width: 81px; height: 29px;"></a>
<!-- cue -->
<a href="@@cue-window-elements#cue_window_grid" class="area" style="left: 0px; top: 42px; width: 274px; height: 146px;"></a>
<a href="@@cue-window-elements#cue_window_sidebar" class="area" style="left: 622px; top: 42px; width: 278px; height: 380px;"></a>
<a href="@@cue-window-elements#cue_window_clip_options" class="area" style="left: 0px; top: 422px; width: 316px; height: 80px;"></a>
<a href="@@cue-window-elements#cue_window_mixer_channels" class="area" style="left: 0px; top: 188px; width: 274px; height: 234px;"></a>
<figcaption>
The Cue Grid window. Clicking on a section accesses its description.
</figcaption>
</figure>
<p>
The Editor, Mixer and Recorder share the same toolbar (the top of the
window). The sections displayed in this toolbar can be customized to
the user's workflow, by checking options in <kbd class="menu">Preferences
&gt; Appearance &gt; Toolbar</kbd>.
The Editor, Mixer, Recorder and Clip Launcher share the same toolbar
(the top of the window). The sections displayed in this toolbar can
be customized to the user's workflow, by checking options in <kbd
class="menu">Preferences &gt; Appearance &gt; Toolbar</kbd>.
</p>
<p>
Switching between the Editor and the Mixer windows is done:
Switching between these 4 different modes is done:
</p>
<ul>
<li>with the <a href="@@other-toolbar-items#mode_selector">Mode Selector
buttons</a> in the upper right</li>
<li>with the <kbd class="mod2">M</kbd> shortcut</li>
<li>with the menu <kbd class="menu">Window &gt; Editor <em>(or Mixer)</em>
<li>with the menu <kbd class="menu">Window &gt; Editor <em>(or Mixer / Recorder / Cue Grid)</em>
&gt; Show</kbd>.</li>
</ul>
<p>
Both windows can be visible at the same time (e.g. for a multi-monitor
setup) using <kbd class="menu">Window &gt; Editor <em>(or Mixer)</em>
Additionnaly, the <kbd class="mod2">M</kbd> shortcut</li> allows swithing
between the Editor and Mixer.
</p>
<p>
Multiple windows can be visible at the same time (e.g. for a multi-monitor
setup) using <kbd class="menu">Window &gt; Editor <em>(or Mixer / Recorder / Cue Grid)</em>
&gt; Detach</kbd> option in the same submenu.
</p>
@ -142,3 +212,21 @@
page</a>.
</p>
<h2>The Cue Grid</h2>
<p>
The <dfn>Cue Grid</dfn> window, unlike the rest of Ardour, allows for
a non-linear workflow. It is a clip launcher, that allows to chain and
combine various loops and samples, and program events.
</p>
<p>
Instead of anchoring these samples or loops on a timeline, the Cue Grid
gives them instruction on when they are triggered, how they are played,
what happens at the end of the clip, etc&hellip;
</p>
<p>
The <a href="@@cue">Cue</a> section of this manual describes this worfkow.
</p>

8
include/cue-window-elements.html
View File

@ -19,7 +19,7 @@
<li>Sidebar: Clips, Tracks, Sources, and Regions</li>
</ol>
<h2>Grid</h2>
<h2 id="cue_window_grid">Grid</h2>
<p>
The trigger slots <dfn>grid</dfn> is comprised of tracks (stacked
@ -71,7 +71,7 @@
on playback in the <dfn>Cue</dfn> window.
</p>
<h2>Mixer channel section</h2>
<h2 id="cue_window_mixer_channels">Mixer channel section</h2>
<p>
The mixer channel section is very similar to what's available in the
@ -81,7 +81,7 @@
and the meter are horizontal, there is no choice for a type of meter.
</p>
<h2>Clip and trigger slot options</h2>
<h2 id="cue_window_clip_options">Clip and trigger slot options</h2>
<p>
The bottom section contains several groups of controls:
@ -98,7 +98,7 @@
assumed original tempo for creative purposes</li>
</ul>
<h2>Sidebar</h2>
<h2 id="cue_window_sidebar">Sidebar</h2>
<p>
Ardour defaults to displaying the <a href="@@clips-overview">Clips</a> tab

16
include/recorder.html
View File

@ -31,7 +31,7 @@
The subsections below describe the secondary toolbar from left to right.
</p>
<h3>Last Take Manager</h3>
<h3 id="recorder_last_take_manager" >Last Take Manager</h3>
<figure class="left">
<img alt="The Last Take Manager" src="/images/recorder_last-take.png">
@ -70,7 +70,7 @@
Capture</kbd> menu would.
</p>
<h3>Global Arm</h3>
<h3 id="recorder_global_arm">Global Arm</h3>
<figure class="left">
<img alt="The Global Arm options" src="/images/recorder_global-arm.png">
@ -88,7 +88,7 @@
all the tracks for recording.
</p>
<h3 class="clear">Monitoring Options</h3>
<h3 class="clear" id="recorder_monitoring_options">Monitoring Options</h3>
<figure class="left">
<img alt="The Monitoring options" src="/images/input-mode-buttons.png">
@ -136,7 +136,7 @@
Input when the master-record arm is engaged (so you are actually
recording).
<h3>'New Playlist' buttons</h3>
<h3 id="recorder_new_playlist">'New Playlist' buttons</h3>
<figure class="left">
<img alt="The 'New Playlist' buttons" src="/images/recorder_new-playlist.png">
@ -169,7 +169,7 @@
name for each playlist, so that they stay somewhat correlated.
</p>
<h3>Disk space and Reset Peaks</h3>
<h3 id="recorder_disk_space">Disk space and Reset Peaks</h3>
<figure class="left">
<img alt="Disk space & Reset Peaks" src="/images/recorder_disk-and-reset.png">
@ -193,7 +193,7 @@
</li>
</ul>
<h2>Tracks</h2>
<h2 id="recorder_tracks">Tracks</h2>
<p>
The Simplified Session View is a view of the session, specifically
@ -222,7 +222,7 @@
available and to facilitate the work of the operator.
</p>
<h3>Simplified Session View</h3>
<h3 id="recorder_simplified_session">Simplified Session View</h3>
<figure>
<img alt="A track in the Recorder" src="/images/recorder_lane.png">
@ -296,7 +296,7 @@
list.
</p>
<h3>The Global Input Panel</h3>
<h3 id="recorder_global_input_channel">The Global Input Panel</h3>
<p>
This panel lists all the audio and MIDI system inputs.

5
source/css/common.css
View File

@ -151,6 +151,11 @@ code {
display: none;
}
.imagemap {position: relative;}
.imagemap img {display: block;}
.imagemap .area {display: block; position: absolute; transition: box-shadow 0.15s ease-in-out;}
.imagemap .area:hover {box-shadow: 0px 0px 1vw white;}
/* Keyboard modifiers */
.mod1:before { content: "Ctrl ";}
.mod2:before { content: "Alt ";}

BIN
source/images/editor_map.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 44 KiB

After

Width:  |  Height:  |  Size: 100 KiB

BIN
source/images/mixer_map.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 49 KiB

After

Width:  |  Height:  |  Size: 108 KiB