aboutsummaryrefslogtreecommitdiffstats
path: root/doc/diagram.drawio
blob: bb8dbd0f1b428e9fcd2d103f131c0720221c1bf3 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
<mxfile host="Electron" modified="2025-02-23T16:24:22.548Z" agent="Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) draw.io/22.1.2 Chrome/114.0.5735.289 Electron/25.9.4 Safari/537.36" etag="8sa4v4RLC4vbyHn2WtNr" version="22.1.2" type="device" pages="2">
  <diagram id="PyNSc7ezSt42GBdjTBvd" name="Launchpad">
    <mxGraphModel dx="1561" dy="962" grid="1" gridSize="10" guides="1" tooltips="1" connect="1" arrows="1" fold="1" page="1" pageScale="1" pageWidth="1169" pageHeight="827" math="0" shadow="0">
      <root>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-0" />
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-1" parent="ZtjfeE3uwfRsFhnWfLYL-0" />
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-39" value="0&lt;br&gt;volume&lt;br&gt;50%" style="rounded=1;whiteSpace=wrap;html=1;container=0;fillColor=#d5e8d4;strokeColor=#82b366;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="40" y="40" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-40" value="16&lt;br&gt;speed&lt;br&gt;50%" style="rounded=1;whiteSpace=wrap;html=1;container=0;fillColor=#ffe6cc;strokeColor=#d79b00;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="40" y="127" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-41" value="32" style="rounded=1;whiteSpace=wrap;html=1;container=0;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="40" y="215" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-42" value="48&lt;br&gt;previous&lt;br&gt;song" style="rounded=1;whiteSpace=wrap;html=1;container=0;fillColor=#f8cecc;strokeColor=#b85450;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="40" y="302" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-43" value="64" style="rounded=1;whiteSpace=wrap;html=1;container=0;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="40" y="389" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-44" value="80" style="rounded=1;whiteSpace=wrap;html=1;container=0;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="40" y="476" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-45" value="96&lt;br&gt;stop" style="rounded=1;whiteSpace=wrap;html=1;container=0;fillColor=#f8cecc;strokeColor=#b85450;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="40" y="564" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-46" value="112&lt;br&gt;play/&lt;br&gt;pause" style="rounded=1;whiteSpace=wrap;html=1;container=0;fillColor=#ffe6cc;strokeColor=#d79b00;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="40" y="651" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-84" value="1&lt;br&gt;volume&lt;br&gt;60%" style="rounded=1;whiteSpace=wrap;html=1;container=0;fillColor=#d5e8d4;strokeColor=#82b366;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="130" y="40" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-85" value="17&lt;br&gt;speed&lt;br&gt;60%" style="rounded=1;whiteSpace=wrap;html=1;container=0;fillColor=#ffe6cc;strokeColor=#d79b00;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="130" y="127" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-86" value="33" style="rounded=1;whiteSpace=wrap;html=1;container=0;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="130" y="215" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-87" value="49&lt;br&gt;-25%" style="rounded=1;whiteSpace=wrap;html=1;container=0;fillColor=#f8cecc;strokeColor=#b85450;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="130" y="302" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-88" value="65" style="rounded=1;whiteSpace=wrap;html=1;container=0;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="130" y="389" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-89" value="81" style="rounded=1;whiteSpace=wrap;html=1;container=0;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="130" y="476" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-90" value="97" style="rounded=1;whiteSpace=wrap;html=1;container=0;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="130" y="564" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-91" value="113" style="rounded=1;whiteSpace=wrap;html=1;container=0;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="130" y="651" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-93" value="2&lt;br&gt;volume&lt;br&gt;70%" style="rounded=1;whiteSpace=wrap;html=1;container=0;fillColor=#d5e8d4;strokeColor=#82b366;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="220" y="40" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-94" value="18&lt;br&gt;speed&lt;br&gt;70%" style="rounded=1;whiteSpace=wrap;html=1;container=0;fillColor=#ffe6cc;strokeColor=#d79b00;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="220" y="127" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-95" value="34" style="rounded=1;whiteSpace=wrap;html=1;container=0;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="220" y="215" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-96" value="50&lt;br&gt;-5%" style="rounded=1;whiteSpace=wrap;html=1;container=0;fillColor=#f8cecc;strokeColor=#b85450;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="220" y="302" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-97" value="66" style="rounded=1;whiteSpace=wrap;html=1;container=0;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="220" y="389" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-98" value="82" style="rounded=1;whiteSpace=wrap;html=1;container=0;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="220" y="476" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-99" value="98" style="rounded=1;whiteSpace=wrap;html=1;container=0;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="220" y="564" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-100" value="114&lt;br&gt;jump to key position" style="rounded=1;whiteSpace=wrap;html=1;container=0;fillColor=#ffe6cc;strokeColor=#d79b00;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="220" y="651" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-102" value="3&lt;br&gt;volume&lt;br&gt;80%" style="rounded=1;whiteSpace=wrap;html=1;container=0;fillColor=#d5e8d4;strokeColor=#82b366;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="310" y="40" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-103" value="19&lt;br&gt;speed&lt;br&gt;80%" style="rounded=1;whiteSpace=wrap;html=1;container=0;fillColor=#ffe6cc;strokeColor=#d79b00;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="310" y="127" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-104" value="35" style="rounded=1;whiteSpace=wrap;html=1;container=0;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="310" y="215" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-105" value="51&lt;br&gt;-1%" style="rounded=1;whiteSpace=wrap;html=1;container=0;fillColor=#f8cecc;strokeColor=#b85450;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="310" y="302" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-106" value="67" style="rounded=1;whiteSpace=wrap;html=1;container=0;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="310" y="389" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-107" value="83" style="rounded=1;whiteSpace=wrap;html=1;container=0;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="310" y="476" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-108" value="&lt;div&gt;99&lt;/div&gt;" style="rounded=1;whiteSpace=wrap;html=1;container=0;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="310" y="564" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-109" value="115" style="rounded=1;whiteSpace=wrap;html=1;container=0;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="310" y="651" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-111" value="4&lt;br&gt;volume&lt;br&gt;90%" style="rounded=1;whiteSpace=wrap;html=1;container=0;fillColor=#d5e8d4;strokeColor=#82b366;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="400" y="40" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-112" value="20&lt;br&gt;speed&lt;br&gt;90%" style="rounded=1;whiteSpace=wrap;html=1;container=0;fillColor=#ffe6cc;strokeColor=#d79b00;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="400" y="127" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-113" value="36" style="rounded=1;whiteSpace=wrap;html=1;container=0;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="400" y="215" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-114" value="52&lt;br&gt;+1%" style="rounded=1;whiteSpace=wrap;html=1;container=0;fillColor=#d5e8d4;strokeColor=#82b366;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="400" y="302" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-115" value="68" style="rounded=1;whiteSpace=wrap;html=1;container=0;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="400" y="389" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-116" value="84" style="rounded=1;whiteSpace=wrap;html=1;container=0;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="400" y="476" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-117" value="100" style="rounded=1;whiteSpace=wrap;html=1;container=0;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="400" y="564" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-118" value="116" style="rounded=1;whiteSpace=wrap;html=1;container=0;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="400" y="651" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-120" value="5&lt;br&gt;volume&lt;br&gt;100%" style="rounded=1;whiteSpace=wrap;html=1;container=0;fillColor=#d5e8d4;strokeColor=#82b366;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="490" y="40" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-121" value="21&lt;br&gt;speed&lt;br&gt;100%" style="rounded=1;whiteSpace=wrap;html=1;container=0;fillColor=#ffe6cc;strokeColor=#d79b00;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="490" y="127" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-122" value="37" style="rounded=1;whiteSpace=wrap;html=1;container=0;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="490" y="215" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-123" value="53&lt;br&gt;+5%" style="rounded=1;whiteSpace=wrap;html=1;container=0;fillColor=#d5e8d4;strokeColor=#82b366;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="490" y="302" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-124" value="69" style="rounded=1;whiteSpace=wrap;html=1;container=0;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="490" y="389" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-125" value="85" style="rounded=1;whiteSpace=wrap;html=1;container=0;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="490" y="476" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-126" value="&lt;div&gt;101&lt;/div&gt;" style="rounded=1;whiteSpace=wrap;html=1;container=0;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="490" y="564" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-127" value="117&lt;br&gt;set key position" style="rounded=1;whiteSpace=wrap;html=1;container=0;fillColor=#ffe6cc;strokeColor=#d79b00;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="490" y="651" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-129" value="6&lt;br&gt;volume&lt;br&gt;110%" style="rounded=1;whiteSpace=wrap;html=1;container=0;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="580" y="40" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-130" value="22&lt;br&gt;speed&lt;br&gt;110%" style="rounded=1;whiteSpace=wrap;html=1;container=0;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="580" y="127" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-131" value="38" style="rounded=1;whiteSpace=wrap;html=1;container=0;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="580" y="215" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-132" value="54&lt;br&gt;+25%" style="rounded=1;whiteSpace=wrap;html=1;container=0;fillColor=#d5e8d4;strokeColor=#82b366;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="580" y="302" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-133" value="70" style="rounded=1;whiteSpace=wrap;html=1;container=0;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="580" y="389" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-134" value="86" style="rounded=1;whiteSpace=wrap;html=1;container=0;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="580" y="476" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-135" value="102" style="rounded=1;whiteSpace=wrap;html=1;container=0;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="580" y="564" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-136" value="118&lt;br&gt;previous key position" style="rounded=1;whiteSpace=wrap;html=1;container=0;fillColor=#f8cecc;strokeColor=#b85450;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="580" y="651" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-138" value="7&lt;br&gt;volume&lt;br&gt;120%" style="rounded=1;whiteSpace=wrap;html=1;container=0;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="670" y="40" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-139" value="23&lt;br&gt;speed&lt;br&gt;120%" style="rounded=1;whiteSpace=wrap;html=1;container=0;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="670" y="127" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-140" value="39" style="rounded=1;whiteSpace=wrap;html=1;container=0;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="670" y="215" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-141" value="55&lt;br&gt;next song" style="rounded=1;whiteSpace=wrap;html=1;container=0;fillColor=#d5e8d4;strokeColor=#82b366;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="670" y="302" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-142" value="71" style="rounded=1;whiteSpace=wrap;html=1;container=0;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="670" y="389" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-143" value="87" style="rounded=1;whiteSpace=wrap;html=1;container=0;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="670" y="476" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-144" value="103" style="rounded=1;whiteSpace=wrap;html=1;container=0;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="670" y="564" width="80" height="80" as="geometry" />
        </mxCell>
        <mxCell id="ZtjfeE3uwfRsFhnWfLYL-145" value="119&lt;br&gt;next key position" style="rounded=1;whiteSpace=wrap;html=1;container=0;fillColor=#d5e8d4;strokeColor=#82b366;" parent="ZtjfeE3uwfRsFhnWfLYL-1" vertex="1">
          <mxGeometry x="670" y="651" width="80" height="80" as="geometry" />
        </mxCell>
      </root>
    </mxGraphModel>
  </diagram>
  <diagram id="R-0UAU87gWX4lK6NCzNs" name="Web wireframe">
    <mxGraphModel dx="1561" dy="962" grid="1" gridSize="10" guides="1" tooltips="1" connect="1" arrows="1" fold="1" page="1" pageScale="1" pageWidth="1169" pageHeight="827" math="0" shadow="0">
      <root>
        <mxCell id="0" />
        <mxCell id="1" parent="0" />
        <mxCell id="0goJ5iq8U8227kam6OUo-1" value="Song list" style="rounded=0;whiteSpace=wrap;html=1;" parent="1" vertex="1">
          <mxGeometry x="80" y="80" width="240" height="360" as="geometry" />
        </mxCell>
        <mxCell id="0goJ5iq8U8227kam6OUo-2" value="Volume slider" style="rounded=0;whiteSpace=wrap;html=1;" parent="1" vertex="1">
          <mxGeometry x="320" y="80" width="440" height="40" as="geometry" />
        </mxCell>
        <mxCell id="0goJ5iq8U8227kam6OUo-3" value="Speed slider" style="rounded=0;whiteSpace=wrap;html=1;" parent="1" vertex="1">
          <mxGeometry x="360" y="160" width="360" height="40" as="geometry" />
        </mxCell>
        <mxCell id="0goJ5iq8U8227kam6OUo-4" value="Speed +5" style="rounded=0;whiteSpace=wrap;html=1;" parent="1" vertex="1">
          <mxGeometry x="720" y="160" width="40" height="40" as="geometry" />
        </mxCell>
        <mxCell id="0goJ5iq8U8227kam6OUo-5" value="Speed -5" style="rounded=0;whiteSpace=wrap;html=1;" parent="1" vertex="1">
          <mxGeometry x="320" y="160" width="40" height="40" as="geometry" />
        </mxCell>
        <mxCell id="E9TFIlIWBKXALOEyTYeL-1" value="Seek slider" style="rounded=0;whiteSpace=wrap;html=1;" parent="1" vertex="1">
          <mxGeometry x="390" y="240" width="300" height="40" as="geometry" />
        </mxCell>
        <mxCell id="E9TFIlIWBKXALOEyTYeL-2" value="Prev song" style="rounded=0;whiteSpace=wrap;html=1;" parent="1" vertex="1">
          <mxGeometry x="320" y="240" width="70" height="40" as="geometry" />
        </mxCell>
        <mxCell id="e6dzTLVl2QyovQL1D1hT-10" value="Next song" style="rounded=0;whiteSpace=wrap;html=1;" parent="1" vertex="1">
          <mxGeometry x="690" y="240" width="70" height="40" as="geometry" />
        </mxCell>
        <mxCell id="2VOf0fCjGpZdvwMfuWx9-2" value="Set key point" style="rounded=0;whiteSpace=wrap;html=1;" parent="1" vertex="1">
          <mxGeometry x="440" y="320" width="200" height="40" as="geometry" />
        </mxCell>
        <mxCell id="eBDQebIGrGTMiAxLC66R-1" value="Previous" style="rounded=0;whiteSpace=wrap;html=1;" parent="1" vertex="1">
          <mxGeometry x="320" y="320" width="120" height="40" as="geometry" />
        </mxCell>
        <mxCell id="eBDQebIGrGTMiAxLC66R-2" value="Next" style="rounded=0;whiteSpace=wrap;html=1;" parent="1" vertex="1">
          <mxGeometry x="640" y="320" width="120" height="40" as="geometry" />
        </mxCell>
        <mxCell id="e5je7AeTKV-z7aj2oazw-2" value="Stop" style="rounded=0;whiteSpace=wrap;html=1;" parent="1" vertex="1">
          <mxGeometry x="320" y="400" width="120" height="40" as="geometry" />
        </mxCell>
        <mxCell id="e5je7AeTKV-z7aj2oazw-3" value="Play/pause" style="rounded=0;whiteSpace=wrap;html=1;" parent="1" vertex="1">
          <mxGeometry x="600" y="400" width="160" height="40" as="geometry" />
        </mxCell>
        <mxCell id="e5je7AeTKV-z7aj2oazw-4" value="Jump" style="rounded=0;whiteSpace=wrap;html=1;" parent="1" vertex="1">
          <mxGeometry x="440" y="400" width="160" height="40" as="geometry" />
        </mxCell>
      </root>
    </mxGraphModel>
  </diagram>
</mxfile>