thisven/Website
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Update logo, favicon and documentation

Browse source
This commit is contained in:
this.ven 2024-01-29 22:33:43 +01:00
parent 7b7ed6b525
commit d52c405fb8
11 changed files with 92 additions and 100 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

28
content/docs/graphics/logo-design/_index.md
View file

@ -39,6 +39,20 @@ are selected in the *fill and stroke* dialog of the object menu explained in the
[basic](https://inkscape.org/doc/tutorials/basic/tutorial-basic.html) tutorial.
Finally, adjusting the *z-order* of the objects creates the layering.
## Iterating on the idea
Some feedback and discussion in a music community chat makes me create just
another iteration to realize that the symbol of a note may be misleading as it
is typically associated with sheet music and notation programs. Thus, I start
a new approach and play around with the Pen tool to create a music wave that
forks into two different directions. The wave form is just a single path with
some [Bezier curve](https://en.wikipedia.org/wiki/B%C3%A9zier_curve) handles.
This drawing technique and a lot of useful applications are described in the
[advanced](https://inkscape.org/doc/tutorials/advanced/tutorial-advanced.html)
Inkscape tutorial.
![Inkscape edit path](inkscape-edit-path.png)
Before saving the document as [SVG](https://en.wikipedia.org/wiki/SVG), useful
meta data can be added by opening the document settings (`<Ctrl><Shift><D>`) and
selecting the *Meta data* tab. Additionally, the *License* tab allows to
@ -88,6 +102,16 @@ convert favicon-tmp.png favicon.ico
rm favicon-tmp.png
```
In addition to [ICO](https://en.wikipedia.org/wiki/ICO_(file_format)) file type
conversion best practice is to stack smaller size versions on top of the 48 x 48
pixels one. This can achieved by opening the `favicon.ico` in GIMP, copying and
scaling the original layer down to 32 x 32 and 16 x 16 pixels, and inserting it
as a [new layer](https://docs.gimp.org/en/gimp-using-layers.html) (`<Ctrl><V>`).
The new layer is inserted into the center of the image and has to be dragged to
the top left corner.
![GIMP stack layers](gimp-stack-layers.png)
## Adding a manifest
For a [Progressive Web App](https://en.wikipedia.org/wiki/Progressive_web_app)
@ -119,3 +143,7 @@ contains the images to be used when integrated as an app in the target OS.
Learn more about the members in the manifest file and best practices for
[PWAs](https://developer.mozilla.org/en-US/docs/Web/Progressive_web_apps) in the
MDN Web Docs.
## Resources
Repository: https://dri.ven.uber.space/thisven/Identity

BIN
content/docs/graphics/logo-design/gimp-stack-layers.png (Stored with Git LFS) Normal file
View file

Binary file not shown.

BIN
content/docs/graphics/logo-design/inkscape-edit-path.png (Stored with Git LFS) Normal file
View file

Binary file not shown.

BIN
static/android-chrome-192x192.png (Stored with Git LFS)
View file

Binary file not shown.

BIN
static/android-chrome-512x512.png (Stored with Git LFS)
View file

Binary file not shown.

BIN
static/apple-touch-icon.png (Stored with Git LFS)
View file

Binary file not shown.

BIN
static/favicon-16x16.png (Stored with Git LFS)
View file

Binary file not shown.

BIN
static/favicon-32x32.png (Stored with Git LFS)
View file

Binary file not shown.

BIN
static/favicon.ico (Stored with Git LFS)
View file

Binary file not shown.

67
static/favicon.svg
View file

@ -13,63 +13,42 @@
xmlns:cc="http://creativecommons.org/ns#"
xmlns:dc="http://purl.org/dc/elements/1.1/">
<title
id="title1">Forking notes</title>
id="title1">Forking wave</title>
<defs
id="defs1" />
<g
id="layer1">
<circle
style="fill:#2a649e;fill-opacity:1;stroke:#2a649e;stroke-width:32;stroke-opacity:1"
id="path1"
cx="132.59662"
cy="396.59662"
r="48.596622" />
<rect
style="fill:#2a649e;fill-opacity:1;stroke:#2a649e;stroke-width:1.43312;stroke-opacity:1"
id="rect2"
width="30.566868"
height="254.56688"
x="165.71655"
y="142.71655"
ry="5.5745006" />
<rect
style="fill:#2a649e;fill-opacity:1;stroke:#2a649e;stroke-width:2.07425;stroke-opacity:1"
id="rect5"
width="73.887077"
height="220.61816"
x="185.09262"
y="-339.45496"
ry="4.8310919"
transform="matrix(0.274006,0.96172798,-0.96079007,0.27727682,0,0)" />
<path
style="fill:none;stroke:#2a691f;stroke-width:32;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
d="m 260.24603,162.30117 c 15.0677,53.98744 25.97478,119.28727 48.16121,170.28693 12.38966,28.47996 27.90668,49.35614 50.02009,64.45676"
id="path3" />
<ellipse
style="fill:none;stroke:#357ec7;stroke-width:32.0973;stroke-opacity:1"
style="fill:none;stroke:#2a691f;stroke-width:32.0973;stroke-opacity:1"
id="ellipse2"
cx="405.00003"
cy="116.00002"
cx="226.81429"
cy="-505.05334"
rx="31.951382"
ry="31.951366" />
<rect
style="fill:#357ec7;fill-opacity:1;stroke:#357ec7;stroke-width:1.43313;stroke-opacity:1"
id="rect4"
width="30.566872"
height="254.56688"
x="421.71658"
y="112.71656"
ry="5.5745001" />
ry="31.951366"
transform="matrix(0.95105652,-0.30901699,-0.30901699,-0.95105652,0,0)" />
<path
style="fill:none;stroke:#3b912b;stroke-width:32;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
d="m 69.546989,252.12258 c -7.262321,-101.53946 6.09304,250.68069 62.894881,-82.98427 11.16827,-70.488286 25.17163,60.04164 42.46634,148.02688 22.90834,152.83798 52.58799,-129.36195 61.30167,-220.862795 9.62104,-90.8388857 -8.88839,168.191465 148.16528,169.652045"
id="path1" />
<ellipse
style="fill:none;fill-opacity:1;stroke:#357ec7;stroke-width:32;stroke-opacity:1"
id="ellipse3"
cx="387.95914"
cy="364.95914"
rx="48.959137"
ry="48.959148" />
style="fill:none;stroke:#3b912b;stroke-width:32.0973;stroke-opacity:1"
id="ellipse1"
cx="376.75336"
cy="-312.23959"
rx="31.951382"
ry="31.951366"
transform="matrix(0.99254615,-0.12186933,-0.12186933,-0.99254615,0,0)" />
</g>
<metadata
id="metadata5">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:date>2024-01-27</dc:date>
<dc:date>2024-01-29</dc:date>
<dc:creator>
<cc:Agent>
<dc:title>this.ven</dc:title>
@ -82,7 +61,7 @@
</dc:rights>
<cc:license
rdf:resource="http://creativecommons.org/licenses/by-sa/4.0/" />
<dc:title>Forking notes</dc:title>
<dc:title>Forking wave</dc:title>
</cc:Work>
<cc:License
rdf:about="http://creativecommons.org/licenses/by-sa/4.0/">

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.1 KiB

After

Width:  |  Height:  |  Size: 3 KiB

67
static/img/logo.svg
View file

@ -13,63 +13,42 @@
xmlns:cc="http://creativecommons.org/ns#"
xmlns:dc="http://purl.org/dc/elements/1.1/">
<title
id="title1">Forking notes</title>
id="title1">Forking wave</title>
<defs
id="defs1" />
<g
id="layer1">
<circle
style="fill:#2a649e;fill-opacity:1;stroke:#2a649e;stroke-width:32;stroke-opacity:1"
id="path1"
cx="132.59662"
cy="396.59662"
r="48.596622" />
<rect
style="fill:#2a649e;fill-opacity:1;stroke:#2a649e;stroke-width:1.43312;stroke-opacity:1"
id="rect2"
width="30.566868"
height="254.56688"
x="165.71655"
y="142.71655"
ry="5.5745006" />
<rect
style="fill:#2a649e;fill-opacity:1;stroke:#2a649e;stroke-width:2.07425;stroke-opacity:1"
id="rect5"
width="73.887077"
height="220.61816"
x="185.09262"
y="-339.45496"
ry="4.8310919"
transform="matrix(0.274006,0.96172798,-0.96079007,0.27727682,0,0)" />
<path
style="fill:none;stroke:#2a691f;stroke-width:32;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
d="m 260.24603,162.30117 c 15.0677,53.98744 25.97478,119.28727 48.16121,170.28693 12.38966,28.47996 27.90668,49.35614 50.02009,64.45676"
id="path3" />
<ellipse
style="fill:none;stroke:#357ec7;stroke-width:32.0973;stroke-opacity:1"
style="fill:none;stroke:#2a691f;stroke-width:32.0973;stroke-opacity:1"
id="ellipse2"
cx="405.00003"
cy="116.00002"
cx="226.81429"
cy="-505.05334"
rx="31.951382"
ry="31.951366" />
<rect
style="fill:#357ec7;fill-opacity:1;stroke:#357ec7;stroke-width:1.43313;stroke-opacity:1"
id="rect4"
width="30.566872"
height="254.56688"
x="421.71658"
y="112.71656"
ry="5.5745001" />
ry="31.951366"
transform="matrix(0.95105652,-0.30901699,-0.30901699,-0.95105652,0,0)" />
<path
style="fill:none;stroke:#3b912b;stroke-width:32;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
d="m 69.546989,252.12258 c -7.262321,-101.53946 6.09304,250.68069 62.894881,-82.98427 11.16827,-70.488286 25.17163,60.04164 42.46634,148.02688 22.90834,152.83798 52.58799,-129.36195 61.30167,-220.862795 9.62104,-90.8388857 -8.88839,168.191465 148.16528,169.652045"
id="path1" />
<ellipse
style="fill:none;fill-opacity:1;stroke:#357ec7;stroke-width:32;stroke-opacity:1"
id="ellipse3"
cx="387.95914"
cy="364.95914"
rx="48.959137"
ry="48.959148" />
style="fill:none;stroke:#3b912b;stroke-width:32.0973;stroke-opacity:1"
id="ellipse1"
cx="376.75336"
cy="-312.23959"
rx="31.951382"
ry="31.951366"
transform="matrix(0.99254615,-0.12186933,-0.12186933,-0.99254615,0,0)" />
</g>
<metadata
id="metadata5">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:date>2024-01-27</dc:date>
<dc:date>2024-01-29</dc:date>
<dc:creator>
<cc:Agent>
<dc:title>this.ven</dc:title>
@ -82,7 +61,7 @@
</dc:rights>
<cc:license
rdf:resource="http://creativecommons.org/licenses/by-sa/4.0/" />
<dc:title>Forking notes</dc:title>
<dc:title>Forking wave</dc:title>
</cc:Work>
<cc:License
rdf:about="http://creativecommons.org/licenses/by-sa/4.0/">

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.1 KiB

After

Width:  |  Height:  |  Size: 3 KiB