diff --git a/ui/button_prompts.svg b/ui/button_prompts.svg
new file mode 100644
index 0000000..aedbb1a
--- /dev/null
+++ b/ui/button_prompts.svg
@@ -0,0 +1,327 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="100mm"
+   height="100mm"
+   viewBox="0 0 100 100"
+   version="1.1"
+   id="svg1"
+   sodipodi:docname="button_prompts.svg"
+   inkscape:version="1.4 (e7c3feb100, 2024-10-09)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview1"
+     pagecolor="#ffffff"
+     bordercolor="#999999"
+     borderopacity="1"
+     inkscape:showpageshadow="0"
+     inkscape:pageopacity="0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#d1d1d1"
+     inkscape:document-units="mm"
+     inkscape:zoom="0.56831833"
+     inkscape:cx="756.61821"
+     inkscape:cy="517.3157"
+     inkscape:current-layer="layer1">
+    <inkscape:page
+       x="0"
+       y="0"
+       width="100"
+       height="100"
+       id="page3"
+       margin="0"
+       bleed="0"
+       inkscape:label="joystick_motion" />
+    <inkscape:page
+       x="110"
+       y="0"
+       width="100"
+       height="100"
+       id="page4"
+       margin="0"
+       bleed="0"
+       inkscape:label="joystick_press" />
+    <inkscape:page
+       x="220"
+       y="0"
+       width="100"
+       height="100"
+       id="page9"
+       margin="0"
+       bleed="0"
+       inkscape:label="press_west" />
+    <inkscape:page
+       x="330"
+       y="0"
+       width="100"
+       height="100"
+       id="page13"
+       margin="0"
+       bleed="0"
+       inkscape:label="press_south" />
+  </sodipodi:namedview>
+  <defs
+     id="defs1" />
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <g
+       id="g7"
+       transform="translate(0,4.6998723)">
+      <circle
+         style="fill:#747474;fill-opacity:1;stroke-width:0.899998"
+         id="path1"
+         cx="50"
+         cy="50"
+         r="41.097931" />
+      <circle
+         style="fill:#595959;fill-opacity:1;stroke-width:0.900001"
+         id="circle3"
+         cx="49.999992"
+         cy="49.999992"
+         r="34.065559" />
+      <circle
+         style="fill:#484848;fill-opacity:1;stroke-width:0.9"
+         id="circle2"
+         cx="49.999996"
+         cy="49.999996"
+         r="17.229031" />
+      <ellipse
+         style="fill:#d0d0d0;fill-opacity:1;stroke:none;stroke-width:14.7;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+         id="circle1"
+         cx="50"
+         cy="28.400267"
+         rx="34.24823"
+         ry="25.968866" />
+      <ellipse
+         style="fill:#b3b3b3;fill-opacity:1;stroke:none;stroke-width:14.7;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+         id="ellipse6"
+         cx="50"
+         cy="27.15729"
+         rx="26.810293"
+         ry="19.692049" />
+      <g
+         id="g9"
+         transform="translate(0,-7.5771503)">
+        <rect
+           style="fill:#ccffaa;fill-opacity:1;stroke:none;stroke-width:14.7;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+           id="rect3"
+           width="7.9877048"
+           height="31.551434"
+           x="46.006149"
+           y="50.399384"
+           rx="0.46106645"
+           ry="0.46106645" />
+        <path
+           sodipodi:type="star"
+           style="fill:#ccffaa;fill-opacity:1;stroke:none;stroke-width:14.7;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+           id="path3"
+           inkscape:flatsided="false"
+           sodipodi:sides="3"
+           sodipodi:cx="50.622078"
+           sodipodi:cy="34.746513"
+           sodipodi:r1="13.018366"
+           sodipodi:r2="6.5091825"
+           sodipodi:arg1="-1.5707963"
+           sodipodi:arg2="-0.52359878"
+           inkscape:rounded="0"
+           inkscape:randomized="0"
+           d="m 50.622078,21.728148 5.637117,9.763774 5.637118,9.763775 -11.274235,-10e-7 -11.274236,0 5.637119,-9.763774 z"
+           inkscape:transform-center-y="-3.2545914"
+           transform="translate(-0.62207777,16.175102)" />
+      </g>
+    </g>
+    <g
+       id="g6"
+       transform="matrix(0.90330206,0,0,0.90330206,15.471661,-4.7788265)"
+       style="stroke-width:1.10705">
+      <rect
+         style="fill:#484848;fill-opacity:1;stroke:none;stroke-width:16.2735;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+         id="rect5"
+         width="40.81094"
+         height="42.997234"
+         x="139.59457"
+         y="57.842659"
+         rx="0.51042336"
+         ry="0.51042324" />
+      <rect
+         style="fill:#d0d0d0;fill-opacity:1;stroke:none;stroke-width:16.2736;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+         id="rect6"
+         width="98.140587"
+         height="24.778067"
+         x="110.92972"
+         y="49.583302"
+         rx="12.389033"
+         ry="12.389033" />
+      <rect
+         style="fill:#747474;fill-opacity:1;stroke:none;stroke-width:16.2736;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+         id="rect4"
+         width="73.560692"
+         height="11.551615"
+         x="123.21967"
+         y="98.51931"
+         rx="1.7609807"
+         ry="1.7609807" />
+      <g
+         id="g8"
+         transform="matrix(-0.83940838,0,0,-0.83940838,283.45933,82.636312)"
+         style="stroke-width:1.31885">
+        <rect
+           style="fill:#ccffaa;fill-opacity:1;stroke:none;stroke-width:19.387;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+           id="rect3-3"
+           width="8.8427839"
+           height="34.928997"
+           x="142.65758"
+           y="54.273052"
+           rx="0.60807514"
+           ry="0.60807514" />
+        <path
+           sodipodi:type="star"
+           style="fill:#ccffaa;fill-opacity:1;stroke:none;stroke-width:17.5123;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+           id="path3-1"
+           inkscape:flatsided="false"
+           sodipodi:sides="3"
+           sodipodi:cx="50.622078"
+           sodipodi:cy="34.746513"
+           sodipodi:r1="13.018366"
+           sodipodi:r2="6.5091825"
+           sodipodi:arg1="-1.5707963"
+           sodipodi:arg2="-0.52359878"
+           inkscape:rounded="0"
+           inkscape:randomized="0"
+           d="m 50.622078,21.728148 5.637117,9.763774 5.637118,9.763775 -11.274235,-10e-7 -11.274236,0 5.637119,-9.763774 z"
+           inkscape:transform-center-y="-3.2545914"
+           transform="matrix(1.1070494,0,0,1.1070494,91.037832,16.385081)" />
+      </g>
+    </g>
+    <g
+       id="g13"
+       transform="matrix(1.3391935,0,0,1.3391935,-91.576217,-16.973177)"
+       style="stroke-width:0.746718">
+      <circle
+         style="fill:#999999;fill-opacity:1;stroke:none;stroke-width:10.9768;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+         id="path11"
+         cx="248.16774"
+         cy="50.039806"
+         r="11.722253" />
+      <circle
+         style="fill:#4d4d4d;fill-opacity:1;stroke:none;stroke-width:10.9768;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+         id="circle11"
+         cx="291.79669"
+         cy="50.039806"
+         r="11.722253" />
+      <circle
+         style="fill:#4d4d4d;fill-opacity:1;stroke:none;stroke-width:10.9768;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+         id="circle12"
+         cx="-71.854279"
+         cy="269.98221"
+         r="11.722253"
+         transform="rotate(-90)" />
+      <circle
+         style="fill:#4d4d4d;fill-opacity:1;stroke:none;stroke-width:10.9768;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+         id="circle13"
+         cx="-28.225328"
+         cy="269.98221"
+         r="11.722253"
+         transform="rotate(-90)" />
+    </g>
+    <g
+       id="g8-3"
+       transform="matrix(-0.48392395,0,0,-0.48392395,311.23446,70.991521)"
+       style="stroke-width:2.06645">
+      <rect
+         style="fill:#ccffaa;fill-opacity:1;stroke:none;stroke-width:30.3766;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+         id="rect3-3-6"
+         width="8.8427839"
+         height="34.928997"
+         x="142.65758"
+         y="54.273052"
+         rx="0.95276642"
+         ry="0.95276642" />
+      <path
+         sodipodi:type="star"
+         style="fill:#ccffaa;fill-opacity:1;stroke:none;stroke-width:27.4393;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+         id="path3-1-1"
+         inkscape:flatsided="false"
+         sodipodi:sides="3"
+         sodipodi:cx="50.622078"
+         sodipodi:cy="34.746513"
+         sodipodi:r1="13.018366"
+         sodipodi:r2="6.5091825"
+         sodipodi:arg1="-1.5707963"
+         sodipodi:arg2="-0.52359878"
+         inkscape:rounded="0"
+         inkscape:randomized="0"
+         d="m 50.622078,21.728148 5.637117,9.763774 5.637118,9.763775 -11.274235,-10e-7 -11.274236,0 5.637119,-9.763774 z"
+         inkscape:transform-center-y="-3.2545914"
+         transform="matrix(1.1070494,0,0,1.1070494,91.037832,16.385081)" />
+    </g>
+    <g
+       id="g17"
+       transform="matrix(0,-1.3391935,1.3391935,0,312.95292,411.59823)"
+       style="stroke-width:0.746718">
+      <circle
+         style="fill:#999999;fill-opacity:1;stroke:none;stroke-width:10.9768;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+         id="circle14"
+         cx="248.16774"
+         cy="50.039806"
+         r="11.722253" />
+      <circle
+         style="fill:#4d4d4d;fill-opacity:1;stroke:none;stroke-width:10.9768;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+         id="circle15"
+         cx="291.79669"
+         cy="50.039806"
+         r="11.722253" />
+      <circle
+         style="fill:#4d4d4d;fill-opacity:1;stroke:none;stroke-width:10.9768;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+         id="circle16"
+         cx="-71.854279"
+         cy="269.98221"
+         r="11.722253"
+         transform="rotate(-90)" />
+      <circle
+         style="fill:#4d4d4d;fill-opacity:1;stroke:none;stroke-width:10.9768;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+         id="circle17"
+         cx="-28.225328"
+         cy="269.98221"
+         r="11.722253"
+         transform="rotate(-90)" />
+    </g>
+    <g
+       id="g18"
+       transform="matrix(-0.48392395,0,0,-0.48392395,451.17504,99.4429)"
+       style="stroke-width:2.06645">
+      <rect
+         style="fill:#ccffaa;fill-opacity:1;stroke:none;stroke-width:30.3766;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+         id="rect17"
+         width="8.8427839"
+         height="34.928997"
+         x="142.65758"
+         y="54.273052"
+         rx="0.95276642"
+         ry="0.95276642" />
+      <path
+         sodipodi:type="star"
+         style="fill:#ccffaa;fill-opacity:1;stroke:none;stroke-width:27.4393;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+         id="path17"
+         inkscape:flatsided="false"
+         sodipodi:sides="3"
+         sodipodi:cx="50.622078"
+         sodipodi:cy="34.746513"
+         sodipodi:r1="13.018366"
+         sodipodi:r2="6.5091825"
+         sodipodi:arg1="-1.5707963"
+         sodipodi:arg2="-0.52359878"
+         inkscape:rounded="0"
+         inkscape:randomized="0"
+         d="m 50.622078,21.728148 5.637117,9.763774 5.637118,9.763775 -11.274235,-10e-7 -11.274236,0 5.637119,-9.763774 z"
+         inkscape:transform-center-y="-3.2545914"
+         transform="matrix(1.1070494,0,0,1.1070494,91.037832,16.385081)" />
+    </g>
+  </g>
+</svg>