User:Karellen/scratchpad: Difference between revisions

From Official Kodi Wiki
Jump to navigation Jump to search
(Add Extended Artwork Images)
mNo edit summary
 
(125 intermediate revisions by 4 users not shown)
Line 1: Line 1:
{{Artwork_Contents}}
__TOC__
{{mininav|[[Artwork]]}}


= Outdated =
This section shows all pages except:
# those updated for Nexus + Omega, and
# those pages belonging to the Categories listed in the following sections
<br>


<section begin="intro" />Music artwork are images directly related to an Artist and Album scraped into the Music library. The images are, preferably, of high quality, that are displayed when viewing the Album or Artist entry in the library. They may also be used as visualisations while playing music. The Music section in Kodi is able to display up to six types of artwork. This page will describe the different types of artwork available in the Music category of Kodi.<section end="intro" />
<dpl>
namespace= HOW-TO||
notcategory = Nexus
notcategory = Omega
notcategory = Skin_development
notcategory = Add-on_development
notcategory = Disambiguation_pages
notcategory = Development
notcategory = Remotes
</dpl>


{{red|'''It is important to note the following:'''}}
*Artwork is skin dependent. This means that some skins display a small number of artwork types, while other skins will display most of the available artwork types.
*In previous versions of Kodi and in older wiki pages, the term Thumbnails was used to describe Artwork. Kodi has now moved away from referring to thumbnails due to the amount of confusion and concern it caused users.
*The base line for all artwork is the default skin Estuary. By default, Estuary displays the Basic artwork. Estuary can display the Extended artwork via additional add-ons.
*While high resolution images do look impressive on HDTV's it is important to be aware that the increased artwork size can negatively affect low powered hardware.
; {{see also|Music_library}}


= Skin Development =
Skin Development Pages only


<dpl>
category = Skin_development
</dpl>


= Basic Music Artwork =
The artwork in the Basic section is the minimum artwork displayed by the default skin Estuary with a standard install.


{{red|'''Note the following:'''}}
*The following naming schemes apply '''only''' to the artwork you have manually sourced and saved. It does not apply to artwork downloaded by the Kodi scraper or any add-on processes.
*To ensure auto-scraping of local artwork, there must be an Artist directory which then contains the Album directories. These album directories contain the individual songs for that album.
*The scraper ignores directory names. The scraper will '''only''' read music tags.


= Development =
Development pages only


== Fanart- Artist ==
<dpl>
[[File:Artwork-MusicFanart01.jpg|400px|right]]
category = Development
Fanart, also known as Wallpapers, Backdrops or Backgrounds, are images that have, in most cases, been created by fans.
</dpl>
;{{see also|wikipedia:Fanart|l1=Fanart on Wikipedia}}


For Kodi, it means digital images, of high quality, that are used as full screen displays to enhance the user experience. The fanart displays the artist or band.
;{{see also|FanArt}}


The image to the right is a typical example of music fanart. It is specifically designed to match the 16:9 ratio of current generation televisions and monitors. This allows the screen to be completely filled by the image.


<div style="{{linear-gradient|bottom|#f5d3ff, #12b2e7}}">
= Add-on Development =
'''Required file properties:'''<br />
<dpl>
<small>Note: The resolution may be increased but ensure the aspect ratio is maintained</small>
category = Add-on_development
{|
</dpl>
|- valign="top"
| '''''File Type'''''
| '''''Aspect Ratio'''''
| '''''Resolution- <small>recommended</small>'''''
|- valign="top"
| width=150px | {{nowrap|*.jpg or png}}
| width=200px | {{nowrap|16:9}}
| width=200px | {{nowrap|1920x1080}}
|}
</div><br />


<div style="{{linear-gradient|top|#f5d3ff, #12b2e7}}">
'''''Naming and Saving conventions for your own manually sourced artwork:'''''
{|
|- valign="top"
| width=300px |'''''Music saved as'''''
| width=250px |'''''File Name'''''
| width=600px |'''''Save name & location example'''''
|- valign="top"
| width=300px |Artist\Album\Songs
| width=250px |fanart.jpg/png
| width=600px |f:\Music\Madonna\fanart.jpg/png
|}
</div>




= Remotes =
<dpl>
category = Remotes
</dpl>


== Folder- Artist ==
[[File:Artwork-MusicArtist01.jpg|400px|right]]
The artist Folder artwork is also known as the Artist Thumb. They are high quality images of the artist or band members. The image to the right is displaying the artist Folder images using the Infowall view in Estuary.


<div style="{{linear-gradient|bottom|#f5d3ff, #12b2e7}}">
'''Required file properties:'''<br />
<small>Note: The resolution may be increased but ensure the aspect ratio is maintained</small>
{|
|- valign="top"
| '''''File Type'''''
| '''''Aspect Ratio'''''
| '''''Resolution- <small>recommended</small>'''''
|- valign="top"
| width=150px | {{nowrap|*.jpg or png}}
| width=200px | {{nowrap|1:1}}
| width=200px | {{nowrap|1000x1000}}
|}
</div><br />


<div style="{{linear-gradient|top|#f5d3ff, #12b2e7}}">
= Disambiguation Pages =
'''''Naming and Saving conventions for your own manually sourced artwork:'''''
<dpl>
{|
category = Disambiguation_pages
|- valign="top"
</dpl>
| width=300px |'''''Music saved as'''''
| width=250px |'''''File Name'''''
| width=600px |'''''Save name & location example'''''
|- valign="top"
| width=300px |Artist\Album\Songs
| width=250px |folder.jpg/png
| width=600px |f:\Music\Madonna\folder.jpg/png
|}
</div>






== Folder- Album ==
= Karellen =
[[File:Artwork-MusicAlbum01.jpg|400px|right]]
<dpl>
The album Folder artwork is also known as the Album Thumb or Album Cover. They are high quality images of the Album cover and each album directory would have its own album Folder image. The image to the right is displaying the album Folder images using the Infowall view in Estuary.
namespace= HOW-TO||
 
  category = Karellen
<div style="{{linear-gradient|bottom|#f5d3ff, #12b2e7}}">
notcategory = Nexus
'''Required file properties:'''<br />
notcategory = Omega
<small>Note: The resolution may be increased but ensure the aspect ratio is maintained</small>
</dpl>
{|
|- valign="top"
| '''''File Type'''''
| '''''Aspect Ratio'''''
| '''''Resolution- <small>recommended</small>'''''
|- valign="top"
| width=150px | {{nowrap|*.jpg or png}}
| width=200px | {{nowrap|1:1}}
| width=200px | {{nowrap|1000x1000}}
|}
</div><br />
 
<div style="{{linear-gradient|top|#f5d3ff, #12b2e7}}">
'''''Naming and Saving conventions for your own manually sourced artwork:'''''
{|
|- valign="top"
| width=300px |'''''Music saved as'''''
| width=250px |'''''File Name'''''
| width=600px |'''''Save name & location example'''''
|- valign="top"
| width=300px |Artist\Album\Songs
| width=250px |folder.jpg/png
| width=600px |f:\Music\Madonna\Like A Prayer\folder.jpg/png
|}
</div>
 
 
 
== Source Folder Artwork ==
[[File:Artwork-VideoFolder01.jpg|400px|right]]
 
The Folder Artwork, also known as Source Folder thumb, can be landscape, portrait or square images that are used to replace the standard folder icons when browsing your music sources in the files section. You will not see this artwork in the Music menu. This image file is saved directly within the Source directory.
 
To enable the image, navigate to Music>Files in the menu system. Highlight a source and call up the Context Menu. Select Choose Thumbnail. If you have saved the image in the correct location, it will be available to select immediately. If not, you will need to navigate to locate and select it. The image must remain in its original location once selected as it will not be cached. Deleting the image will remove it from view in the folder icon.
 
You are able to also apply the folder thumb by modifying the '''\userdata\sources.xml''' as follows
 
<pre><nowiki>
<source>
  <name>music</name>
  <path>xbms://192.168.1.100:1400/Music/</path>
  <thumbnail>F:\Apps\XBMC\thumbs\shares\thumb.png</thumbnail>
</source>
</nowiki></pre>
 
<div style="{{linear-gradient|bottom|#f5d3ff, #12b2e7}}">
'''Required file properties:'''<br />
<small>Note: The resolution may be increased but ensure the aspect ratio is maintained</small>
{|
|- valign="top"
| '''''File Type'''''
| '''''Aspect Ratio'''''
| '''''Resolution- <small>recommended</small>'''''
|- valign="top"
| width=150px | {{nowrap|*.jpg}}
| width=200px | {{nowrap|16:9}}
| width=200px | {{nowrap|640x360}}
|- valign="top"
| width=150px | {{nowrap|*.jpg}}
| width=200px | {{nowrap|1:1.5}}
| width=200px | {{nowrap|400x600}}
|- valign="top"
| width=150px | {{nowrap|*.jpg}}
| width=200px | {{nowrap|1:1}}
| width=200px | {{nowrap|500x500}}
|}
</div><br />
 
<div style="{{linear-gradient|top|#f5d3ff, #12b2e7}}">
'''''Naming conventions for your own manually sourced artwork:'''''
{|
|- valign="top"
| width=200px |'''''Saved movies as'''''
| width=250px |'''''File Name'''''
| width=600px |'''''Save Location'''''
|- valign="top"
| width=200px |Folder Artwork:
| width=250px |folder.jpg
| width=600px |f:\Music\folder.jpg
|- valign="top"
| width=200px |Alternative name:
| width=250px |<foldername>.jpg
| width=600px |f:\Musc\Music.jpg
|}
</div>
 
 
{{highlight|'''-------------------Edited to this point--------------------'''|bordered=yes|color=red}}
 
 
= Extended TV Show Artwork =
To display the Extended artwork, an add-on will need to be installed to extend the image handling capabilities of Kodi and the skins. Once this is installed, it will insert extra artwork fields which become available to use in the Skins. The add-on can then be used to either automatically scrape the extra artwork or, due to the newly available artwork fields, you can [[Artwork#Kodi-_Choose_Art|manually search]] and insert your own local artwork.
One example is The Artwork Downloader add-on which can be installed from the official Kodi repository.
; {{see also|Add-on:Artwork_Downloader}}
 
{{red|'''Note the following:'''}}
*The following naming schemes apply '''only''' to the artwork you have manually sourced and saved. It does not apply to artwork downloaded by the Kodi scraper or any add-on processes.
*To ensure auto-scraping of local artwork, there must be an Artist directory which then contains the Album directories. These album directories contain the individual songs for that album.
*If using the Artwork Downloader add-on, it is important to note the following
**The add-on has the option to use local artwork (if correctly named and saved) or online artwork. This can be selected in the settings page of the add-on
**If you have more than one episode in a single directory, the add-on will scrape the online and also the local artwork if correctly named and saved.
**Using the Kodi scraper will not download extended artwork. The artwork downloader is required to be run after the Kodi scrape process. i.e. you are performing two scrapes.
 
 
== ClearArt ==
[[File:Artwork-MusicBanner01.jpg|400px|right]]
 
ClearArt are images that are saved on a transparent background. This allows the image to be overlayed on another image or playing video. The images normally include the tv show name or logo, along with an iconic prop or scene from the tv show, or an actors image.
 
The image to the right is displaying ClearArt at the bottom right corner of the image.
 
<div style="{{linear-gradient|bottom|#f5f5a1, #a1f5e4}}">
'''Required file properties:'''<br />
<small>Note: The resolution may be increased but ensure the aspect ratio is maintained</small>
{|
|- valign="top"
| '''''File Type'''''
| '''''Aspect Ratio'''''
| '''''Resolution- <small>recommended</small>'''''
|- valign="top"
| width=150px | {{nowrap|*.png}}
| width=200px | {{nowrap|1:0.562}}
| width=200px | {{nowrap|500*281}}
|}
</div><br />
 
<div style="{{linear-gradient|top|#f5f5a1, #a1f5e4}}">
'''''Naming and Saving conventions for your own manually sourced artwork:'''''
{|
|- valign="top"
| width=300px |'''''Saved movies as'''''
| width=250px |'''''File Name'''''
| width=600px |'''''Save Location and example'''''
|- valign="top"
| width=300px |BluRay & DVD Structure:
----
| width=250px |clearart.png
----
| width=600px |f:\TVShows\Dominion\clearart.png
----
|- valign="top"
| width=300px |One episode per directory in the TV Show:
----
| width=250px |clearart.png
----
| width=600px |f:\TVShows\Dominion\clearart.png
----
|- valign="top"
| width=300px |All episodes in TV Show directory:
| width=250px |clearart.png
| width=600px |f:\TVShows\Dominion\clearart.png
|}
</div>
 
 
 
== Clearlogo ==
[[File:Artwork-MusicBanner01.jpg|400px|right]]
 
This is the basic tv show logo or name on a transparent background. The logo uses the distinctive font of the tv show and is uncluttered by images from the show or actors. The transparent background allows it to be overlayed on other images or video with minimal impact.
 
The image on the right is displaying the tv show listing using the Logo view in the Aeon Nox skin.
 
<div style="{{linear-gradient|bottom|#f5f5a1, #a1f5e4}}">
'''Required file properties:'''<br />
<small>Note: The resolution may be increased but ensure the aspect ratio is maintained</small>
{|
|- valign="top"
| '''''File Type'''''
| '''''Aspect Ratio'''''
| '''''Resolution- <small>recommended</small>'''''
|- valign="top"
| width=150px | {{nowrap|*.png}}
| width=200px | {{nowrap|1:0.388}}
| width=200px | {{nowrap|400x155}}
|}
</div><br />
 
<div style="{{linear-gradient|top|#f5f5a1, #a1f5e4}}">
'''''Naming and Saving conventions for your own manually sourced artwork:'''''
{|
|- valign="top"
| width=300px |'''''Saved movies as'''''
| width=250px |'''''File Name'''''
| width=600px |'''''Save Location and example'''''
|- valign="top"
| width=300px |BluRay & DVD Structure:
----
| width=250px |clearlogo.png
----
| width=600px |f:\TVShows\Dominion\clearlogo.png
----
|- valign="top"
| width=300px |One episode per directory in the TV Show:
----
| width=250px |clearlogo.png
----
| width=600px |f:\TVShows\Dominion\clearlogo.png
----
|- valign="top"
| width=300px |All episodes in TV Show directory:
| width=250px |clearlogo.png
| width=600px |f:\TVShows\Dominion\clearlogo.png
|}
</div>
 
 
 
== Character Art ==
[[File:Artwork-MusicBanner01.jpg|400px|right]]
Character Art, also known simply as Character, is an image of the main or prominent character in a tv show. It uses a transparent background in a similar fashion to Clear Logo and Clear Art. There are very few skins that display this artwork.
 
The image to the right displays the Clear Logo and Character Art in the top right corner.
 
<div style="{{linear-gradient|bottom|#f5f5a1, #a1f5e4}}">
'''Required file properties:'''<br />
<small>Note: The resolution may be increased but ensure the aspect ratio is maintained</small>
{|
|- valign="top"
| '''''File Type'''''
| '''''Aspect Ratio'''''
| '''''Resolution- <small>recommended</small>'''''
|- valign="top"
| width=150px | {{nowrap|*.png}}
| width=200px | {{nowrap|16:9}}
| width=200px | {{nowrap|800x310}}
|}
</div><br />
 
<div style="{{linear-gradient|top|#f5f5a1, #a1f5e4}}">
'''''Naming and Saving conventions for your own manually sourced artwork:'''''
{|
|- valign="top"
| width=300px |'''''Saved movies as'''''
| width=250px |'''''File Name'''''
| width=600px |'''''Save Location and example'''''
|- valign="top"
| width=300px |BluRay & DVD Structure:
----
| width=250px |characterart.png
----
| width=600px |f:\TVShows\Dominion\characterart.png
----
|- valign="top"
| width=300px |One episode per directory in the TV Show:
----
| width=250px |characterart.png
----
| width=600px |f:\TVShows\Dominion\characterart.png
----
|- valign="top"
| width=300px |All episodes in TV Show directory:
| width=250px |characterart.png
| width=600px |f:\TVShows\Dominion\characterart.png
|}
</div>
 
 
 
== Landscape ==
[[File:Artwork-MusicBanner01.jpg|400px|right]]
Landscape, also known as TV Show Thumbs (as distinct from Episode Thumbs), are specially made small fanart images. The main differences between Landscape and Fanart images is that Landscape image contains the tv show logo. They are used in certain page layouts for movie browsing. The original intent of this artwork has blurred over the years so if you have no Landscape images, it is safe to use your Fanart or Extrafanart images.
 
The image to the right displays the Landscape view in Aeon Nox skin.
 
<div style="{{linear-gradient|bottom|#f5f5a1, #a1f5e4}}">
'''Required file properties:'''<br />
<small>Note: The resolution may be increased but ensure the aspect ratio is maintained</small>
{|
|- valign="top"
| '''''File Type'''''
| '''''Aspect Ratio'''''
| '''''Resolution- <small>recommended</small>'''''
|- valign="top"
| width=150px | {{nowrap|*.jpg}}
| width=200px | {{nowrap|16:9}}
| width=200px | {{nowrap|1000x562}}
|}
</div><br />
 
<div style="{{linear-gradient|top|#f5f5a1, #a1f5e4}}">
'''''Naming and Saving conventions for your own manually sourced artwork:'''''
{|
|- valign="top"
| width=300px |'''''Saved movies as'''''
| width=250px |'''''File Name'''''
| width=600px |'''''Save Location and example'''''
|- valign="top"
| width=300px |BluRay & DVD Structure:
----
| width=250px |landscape.jpg
----
| width=600px |f:\TVShows\Dominion\landscape.jpg
----
|- valign="top"
| width=300px |One episode per directory in the TV Show:
----
| width=250px |landscape.jpg
----
| width=600px |f:\TVShows\Dominion\landscape.jpg
----
|- valign="top"
| width=300px |All episodes in TV Show directory:
| width=250px |landscape.jpg
| width=600px |f:\TVShows\Dominion\landscape.jpg
|}
</div>
 
 
 
= Skin Dependent & Other Artwork =
The following artwork requires a skin that supports that type of artwork.
;{{see also|skin}}
:'''''See also: [https://kodi.tv/addons/browse?keyword=&category=1192&author=&sort=title+ASC<nowiki>Add-on Search</nowiki>]'''''
 
 
== Disc ==
[[File:Artwork-MusicBanner01.jpg|400px|right]]
 
DiscArt requires the use of a supporting skin. It replicates the picture on the physical DVD and Bluray disc. Although the disc artwork is round, the image itself is square and the disc image is placed on a transparent background.
 
<div style="{{linear-gradient|bottom|#f5f5a1, #a1f5e4}}">
'''Required file properties:'''<br />
<small>Note: The resolution may be increased but ensure the aspect ratio is maintained</small>
{|
|- valign="top"
| '''''File Type'''''
| '''''Aspect Ratio'''''
| '''''Resolution- <small>recommended</small>'''''
|- valign="top"
| width=150px | {{nowrap|*.png}}
| width=200px | {{nowrap|1:1}}
| width=200px | {{nowrap|1000x1000}}
|}
</div><br />
 
<div style="{{linear-gradient|top|#f5f5a1, #a1f5e4}}">
'''''Naming and Saving conventions for your own manually sourced artwork:'''''
{|
|- valign="top"
| width=300px |'''''Saved movies as'''''
| width=250px |'''''File Name'''''
| width=600px |'''''Save Location and example'''''
|- valign="top"
| width=300px |BluRay & DVD Structure:
----
| width=250px |disc.png
----
| width=600px |f:\TVShows\Dominion\disc.png
----
|- valign="top"
| width=300px |One episode per directory in the TV Show:
----
| width=250px |disc.png
----
| width=600px |f:\TVShows\Dominion\disc.png
----
|- valign="top"
| width=300px |All episodes in TV Show directory:
| width=250px |disc.png
| width=600px |f:\TVShows\Dominion\disc.png
|}
</div>
 
 
 
== Logo ==
The Logo has the same qualities and properties as the ClearLogo. These two items can be easily interchanged. Although, there are logo's with a solid background rather than a transparent background and these should not be used to replace the ClearLogo.
 
 
 
== Extra fanart & thumbs ==
Extra fanart is reliant on a supporting skin and have exactly the same properties as the standard Fanart.
 
It is possible to download and save additional high quality Fanart which the skin can display, usually in a slideshow.
; {{see also|Extra_Fanart}}
 
 
 
{{Top}}
MUSIC----
http://kodi.wiki/view/Adding_music_to_the_library
http://kodi.wiki/index.php?title=Artwork&oldid=81191
 
{{updated|17}}
[[Category:Guides]]
[[Category:First Time User]]
[[Category:FAQ]]
[[Category:Manual]]
[[Category:Index]]
[[Category:Video library]]
[[Category:Quick Start Guide]]
[[Category:Advanced topics]]

Latest revision as of 04:13, 8 February 2023

Outdated

This section shows all pages except:

  1. those updated for Nexus + Omega, and
  2. those pages belonging to the Categories listed in the following sections



Skin Development

Skin Development Pages only


Development

Development pages only


Add-on Development


Remotes


Disambiguation Pages


Karellen