Skip to content

Latest commit

 

History

History
152 lines (110 loc) · 11.8 KB

README.md

File metadata and controls

152 lines (110 loc) · 11.8 KB
Raw

Iconic Original (ES-DE Version)

(This version of the theme maintains the original artwork) Iconic is an EmulationStation-DE theme that aims to provide a modern UI appearance while also highlighting famous characters from each system. It includes many textlist and gridview options while also adding new multi-layered artwork for popular systems. Inspiration and templates were taken from the following themes:

Preview

System View Gamelist View
(Simple) System View (Simple) Gamelist View
MainSystem MainTextlist

Configuration Options

  • This theme has a simple set of options that can be changed directly from the UI Settings menu of ES-DE

  • Theme Aspect Ratio - sets the aspect ratio the theme will render at. If needed, this can be changed to match the aspect ratio of your screen (though it should happen automatically).

    • 16:9
    • 16:10
    • 4:3
    • 19.5:9
    • 1:1

  • Theme Variant - sets the layout used for the gamelist view when media & metadata are scraped for your games. Simple variants will have a minimal System view without overlays and reduce the amount of metadata shown. All settings will scale the size of the gamelist and the amount of metadata shown based on the selected font size. X-Large font will disable metadata and show only the boxart for Textlist/Carousel views.:

    • Textlist - A simple list of game names on the right with the miximage on the left.

    • Carousel - A vertical carousel of game marquees on the right and the game miximage on the left.

    • Grid: Boxart - A grid view that displays boxart covers with metadata on the left.

    • Grid: Physical Media - A grid view that displays physical media images with metadata on the left.

    • Grid: Titlescreen - A grid view that displays titlescreens with metadata on the left.

    • Grid: Marquee - A grid view that displays marquees with metadata on the left.

    • (Simple) Textlist - Simple System view. A simple list of game names on the right with reduced metadata on the left.

    • (Simple) Carousel - Simple System view. A vertical carousel of game marquees on the right and minimal metadata on the left.

    • (Simple) Carousel Horizontal - Simple System view. A horizontal carousel of game boxart with minimal metadata below.

    • (Simple) Grid: Boxart - Simple System view. A grid view that spands the entire width of the screen and displays boxart covers.

    • (Simple) Grid: Physical Media - Simple System view. A grid view that spands the entire width of the screen and displays physical media.

  • Theme Color Scheme - There are 3 types of color schemes that are used for the overall theme on all views, Light, Dark, and Retro-Gray. Each of these color schemes allow you to choose from: Classic, Modern, or Custom. This will indicate which art style to use. Classic using more official game art while Modern uses updated renders of characters. Custom allows user-defined artwork that can be mixed without changing the xml.

    • Light - A white scheme in Classic, Modern, or Custom styles.
    • Dark - A dark scheme in Classic, Modern, or Custom styles.
    • Retro Gray - A SNES inspired color scheme in Classic, Modern, or Custom styles.

  • Theme Font Size - enables you to change the size of the fonts displayed in the theme. It will also scale the size of the grid and carousel.

    • Small - good for display on tvs and computer monitors. Smallest Grid size.
    • Medium - good for display on tvs and computer monitors. Medium Grid sizing.
    • Large - good for display on large handheld screens at 6 inches or larger. Medium Grid sizing.
    • Extra Large - good for display on small handheld screens at 6 inches or below. Largest Grid sizing and disables most metadata.

Preview of Variants and Color Schemes

Color Variant SystemView GamelistView
Dark-Classic Carousel & Boxart SNESClassic-Dark SNESClassic-Dark-Carousel
Light-Classic (Simple) Horizontal Carousel SampleMain LightCarousel
Retro Gray-Classic Textlist & Miximage GenesisClassic-RetroGray GenesisClassic-RetroGray-Textlist
Color Variant SystemView GamelistView
Dark-Modern Grid: Boxart SampleDarkPSX SampleDarkGrid
Light-Modern Grid: Physical Media SampleLightGBC SampleGBCCarts
Retro Gray-Modern (Simple) Grid: Boxart ModernRetroSystem ModernRetroGrid

Preview of Font Sizes (Simple Variants)

Small Medium
SmallFont MediumFont
Large X-Large
LargeFont XLargeFont

Theme Customizations

This theme allows customizations to artwork without the need to edit the source XML. This enables you to change the look of the theme and still retain any changes when the root theme is updated.

Start Here

  • Make sure Light (Custom Artwork), Dark (Custom Artwork), or Retro Gray (Custom Artwork) is selected from Menu > UI Settings > Theme Variant
  • This setting changes the directories that the theme looks for artwork in and sets up the ability for you to add custom artwork.
  • If desired, users can mix and match classic/modern art. There is also an alternate background/overlay folder that can give additional options.

Backgrounds

  • Use the folder called custom-backgrounds in ES-DE's theme directory at: ES-DE/themes/iconic-es-de/_inc/systems
  • Copy your custom background images to that folder
  • They should be named:
    • ${system.theme}.webp
    • _default.webp
  • ${system.theme}.webp should be named for the system you are looking to override. For example if you wanted to override the artwork for snes you would create an image called snes.webp in the backgrounds folder.
  • If a given ${system.theme}.webp image is not found, it will use _default.jpg image, so make sure to keep that file.

Overlays

  • Custom overlays can be added to help make images pop. These are only active in non-"Simple" variants.
  • These should be in a 16:9 1920x1080 aspect ratio and a transparent .webp format to have the desired effect.
  • Use the folder called custom-overlay in ES-DE's theme directory at: ES-DE/themes/iconic-es-de/_inc/systems
  • Upload your custom overlay images to that folder. Be aware that these will appear on top of all other assets on that screen.
  • They should be named:
    • ${system.theme}.webp

Additional Notes

This theme may be resource intensive due to the layering of images. This is especially true when utilizing the grid view or the non-"Simple" variants. Increasing the VRAM limit under "Other Settings" within the ES-DE menu is useful if pop-in is experienced.

Acknowledgments

Artwork was designed and created by the following artists and credit is provided to them.

License

Creative Commons CC-BY-NC-SA - https://creativecommons.org/licenses/by-nc-sa/2.0/ You are free to share and adapt this theme as long as you provide attribution back to me (and the above credits) as well share any updates you make under the same licence terms.