NeoActive, RetroActive and Systematic Theme Support and Feedback

RetroArch Additions Themes
#1

I hope you enjoy the NeoActive, RetroActive and Systematic themes for the XMB in RetroArch and Lakka. I have been providing support via the retroarch-assets issues page on GitHub, but I’d like to receive feedback from those who visit the Libretro forums.

If you see an issue with the icons, desktop patterns or fonts of these themes, feel free to respond in this thread.

Did you know that these themes are filled with “easter egg” icons you’ll never see unless you dig into the codebase? For reference, the default RetroArch/Lakka theme has about 300 icons. Systematic has over 610 icons. Retroactive has over 340 icons plus an alternative icon set of 145 icons with parody logos instead of blank labels. The only way to currently use those icons is to rename them with the file name of the default within the theme folder.

I’ve thought about making region-specific themes to help bring some of these icons into the limelight. If I were to do so, I’d probably reduce my focus from three themes down to one. I’d really like to hear what you think about these themes and that will help me decide what to do in the future.

2 Likes
#2

Ha, I didn’t know about the easter egg icons. I’ll have to check those out

1 Like
#3

How do we acquire these themes? I’d love to try them out. I’m just now starting to get into customizing the RA menus.

#4

I really like Systematic, currently using the netyaroze’s png for a playlist with psx-beetle-hw.

So i just wanted to thank you. (since netplay.png was added, which was the only thing missing recently)

Weird to admit, but part of the fun in using RA lies around picking icons for custom playlists :stuck_out_tongue:

1 Like
#5

@SkyHighGam3r They’re already installed. In Lakka, go to Settings > Menus > MenuIcon Theme or in RA, go to Settings > User Interface > Menus > MenuIcon Theme and you can toggle between the default Monochrome theme and other installed themes. Currently, there’s Dot-Art, FlatUI, NeoActive, Pixel, RetroActive and Systematic to choose from.

If you end up making your own theme, you can contribute them to the retroarch-asssets project and they will be added to the build.

#6

@TrueMotion You’re welcome. Glad to hear you like Systematic. As @Kivutar adds new files to Monochrome, I try to add corresponding icons for the themes I maintain so you don’t see the dreaded “black box.” Sometimes I’m quicker to catch it than others. If you see stuff like that, add it to this thread and I will work to get it fixed as soon as I can.

2 Likes
#7

Just a small nitpick,

The “New Nintendo 2DS XL” is labeled as the “Nintendo - New Nintendo 3DS JAN-001”. I blame Nintendo’s stupid naming conventions, of course. :stuck_out_tongue:

#8

Big picture, I’m just surprised anyone noticed that I had made a Systematic icon for the New 2DS XL in the set before the system was even released. Thanks for noticing! I see your point and I appreciate the nitpick. You’ll note that the 2DS is called “Nintendo - Nintendo 3DS FTR-001” for the same reason.

For better or worse, the Libretro system and content names are generally derived from the No Intro naming conventions, which I have included in a list below. There’s an entry for 3DS and New 3DS, but there will likely never be an entry for 2DS and New 2DS XL because those systems technically play 3DS or New 3DS games. They’re 3DS systems with the 3D feature removed.

Part of the reason I moved to naming with model numbers was because of the 2DS quandary. I could have chosen to call them “Nintendo - New Nintendo 3DS New 2DS XL” and “Nintendo - Nintendo 3DS 2DS” but it seemed a bit much. I ran into the same problem when making icons for PlayStation TV, which is technically part of the PS Vita family.

The Atari, Sony and Nintendo icons are labeled with model numbers because they were easy to find. I actually could use a good model list for other companies. If anyone finds a good list or would like to make one, please pass it on and I will get the files renamed accordingly.

  • Atari - 2600
  • Atari - 5200
  • Atari - 7800
  • Atari - Jaguar
  • Atari - Lynx
  • Atari - ST
  • Bandai - WonderSwan
  • Bandai - WonderSwan Color
  • Benesse - Pocket Challenge V2
  • Casio - Loopy
  • Casio - PV-1000
  • Coleco - ColecoVision
  • Commodore - 64
  • Commodore - 64 (PP)
  • Commodore - 64 (Tapes)
  • Commodore - Amiga
  • Commodore - Plus-4
  • Commodore - VIC-20
  • Emerson - Arcadia 2001
  • Entex - Adventure Vision
  • Epoch - Super Cassette Vision
  • Fairchild - Channel F
  • Funtech - Super Acan
  • GamePark - GP32
  • GCE - Vectrex
  • Hartung - Game Master
  • LeapFrog - Leapster Learning Game System
  • Magnavox - Odyssey2
  • Microsoft - MSX
  • Microsoft - MSX2
  • Microsoft - XBOX 360 (DLC)
  • Microsoft - XBOX 360 (Games on Demand)
  • Microsoft - XBOX 360 (Title Updates)
  • NEC - PC Engine - TurboGrafx 16
  • NEC - PC Engine SuperGrafx
  • Nintendo - Family Computer Disk System
  • Nintendo - Game Boy
  • Nintendo - Game Boy Advance
  • Nintendo - Game Boy Advance (e-Cards)
  • Nintendo - Game Boy Color
  • Nintendo - New Nintendo 3DS
  • Nintendo - New Nintendo 3DS (DLC)
  • Nintendo - Nintendo 3DS
  • Nintendo - Nintendo 3DS (DLC)
  • Nintendo - Nintendo 64
  • Nintendo - Nintendo 64DD
  • Nintendo - Nintendo DS
  • Nintendo - Nintendo DS (Download Play)
  • Nintendo - Nintendo DSi
  • Nintendo - Nintendo DSi (DLC)
  • Nintendo - Nintendo Entertainment System
  • Nintendo - Nintendo Wii (DLC)
  • Nintendo - Pokemon Mini
  • Nintendo - Satellaview
  • Nintendo - Sufami Turbo
  • Nintendo - Super Nintendo Entertainment System
  • Nintendo - Virtual Boy
  • Philips - Videopac+
  • RCA - Studio II
  • Sega - 32X
  • Sega - Game Gear
  • Sega - Master System - Mark III
  • Sega - Mega Drive - Genesis
  • Sega - PICO
  • Sega - SG-1000
  • Sinclair - ZX Spectrum +3
  • SNK - Neo Geo Pocket
  • SNK - Neo Geo Pocket Color
  • Sony - PlayStation Portable
  • Sony - PlayStation Portable (PSX2PSP)
  • Sony - PlayStation Portable (UMD Music)
  • Sony - PlayStation Portable (UMD Video)
  • Sony - PlayStation Vita
  • Tiger - Game.com
  • VTech - CreatiVision
  • VTech - V.Smile
  • Watara - Supervision
  • WIP Sony - PlayStation 3 (DL)
  • WIP Sony - PlayStation Portable (DL)
  • WIP Sony - PlayStation Vita (DL)
  • zTEST
2 Likes
#9

Hi, just want to cooperate with these amazing themes. I found that the Atari XEGS (playable using MAME) is missing, so I created icons for this system for RetroActive and Systematic. I was not able to do them for NeoActive. I hope you like them. The console for Systematic was taken from Atari 7800 one. The cartridge from Atari 5200 and the controller from the classic of Atari 2600. This is my first attempt and wanted to contribute.

1 Like
#10

I only use the default theme because of the missing icons, other than that it’s awesome!

#11

@Flooder I’m glad you think the icons are awesome. That helps keep me going.

I do my best to keep these three themes in sync with Monochrome. I’ve also contributed to Monochrome so that it maintains parity with my additions as well. To my knowledge, all three themes have a complete set of icons in the repository as of the end of August.

Keep in mind that I don’t receive any notification when more icons are added to Monochrome unless they’re contributed via pull request. @Kivutar is able to submit additions directly, so I don’t get a notification when he does so. I have to watch out for additions and then add them to my to-do list. I add them as soon as I can, but that usually means that when RA or Lakka is updated to a stable version, the other themes don’t get the missing icons added until the next release. To my knowledge, the only simple way around that is to use a nightly build.

Bottom line is I would encourage you to use the theme you like the most and be patient with theme contributors as they work on recent additions. If you see a missing icon, let me know here or over on the retroarch-assets issues page and I will work on getting it added ASAP. Thanks again!

1 Like
#12

@CafeteroCordoba Working out from an existing icon is a great place to start. But with the XEGS, you picked a difficult icon to start with. So let me teach by showing my quick rendition and give you some quick tips that might help out.

When I design an icon, I like to start by looking up the console dimensions online and make the outer box proportional, but rounded to the nearest grid point. I begin drawing with black, white and gray in 5% increments. Make sure you do your best to make sure all the points on the shape align to the grid. For the XEGS, the diagonals make this impossible for all the points on the cartridge slot and character lines to align, so you just have to live with with it and know you did your best. Lastly, feel free to play with the grayscale to simulate highlights and shadow, even when they don’t really necessarily appear that way on the console.

After that, I add colors only from the palette. I realize the palette is fairly limited and does not have pastels, which once again makes the XEGS a challenge. But it brings uniformity to the set. As you create other icons in the system family, do your best to coordinate the colors so they look like they go together.

There are more tips over on the Guide to Making Themes post. I had intended to contribute to existing themes, but I kept making more and more icons and it eventually became a standalone theme! If you want to contribute to an existing theme, that’s great too. The FlatUI and Pixel themes are missing icons and could use some more contributions to “complete the set” if you’re interested.

#13

There need to be an icon for renaming an item! Also, I feel like the gear icon looks kinda odd IMO.

I don’t know what it is but something about the borders feel off on the gear icon… it’s just my opinion, you can do whatever you want!

#14

The last version of the rename icon was added to GitHub on August 29. I actually submitted them earlier but an issue was found and corrected. Like I said, you have to wait until the next version is released to actually see it in the theme.

https://github.com/libretro/retroarch-assets/blob/master/xmb/systematic/png/rename.png https://github.com/libretro/retroarch-assets/blob/master/xmb/retroactive/png/rename.png https://github.com/libretro/retroarch-assets/blob/master/xmb/neoactive/png/rename.png

As for the Gear icon, I see what you mean. Perhaps I should lighten the gray for both of them to give it a bit more contrast. Maybe I’ll even try an outline to give them a bit more depth. Thanks for the tip!

1 Like
#15

WOW, amazing job, a lot better that my contributions. I’ll try and do my best for the other sets you mentioned. Thanx again.

#16

@CafeteroCordoba Don’t sell yourself short. My first Libretro icons began as modifications of existing icons from the FlatUI set, so you’re on the right track. It’s taken a long time and a lot of mistakes along the way to get where I’m at. And I also still have a long way to go!

I did notice that your icons had a lot of rough, pixelated edges. Are you using PhotoShop, GIMP or some other raster-based application? If so, I would highly encourage you to use Inkscape, Illustrator or some other vector-based drawing application. Grab the SVG files off of GitHub and experiment with them to get the hang of things.

Be patient and persevere. I’ll never forget having RetroActive fairly complete, submitting it to GitHub and getting @Kivutar’s critiques. I had to modify every single icon in the set to implement his changes, but I’m glad I did because I learned so much and it made me a better artist. Don’t get discouraged. Keep your chin up and keep moving forward!!!

#17

@baxysquare why does the SVG files have bitmaps in them? i opened some with Inkscape and found embedded images, they should be vector graphics

i like your themes, made a mix of retroactive marked with the hexagons from systemactive, and some extras for genre-based playlists. Uploaded to github and called it retrosystem

#18

@alfrix The issues with the SVGs have to do with the fact that they are exported from the Illustrator PDF files via the ImageMagick Mogrify command. For my monochrome contributions, I had to use Inkscape to open an individual PDF, resize the canvas and icon, center it on the canvas and then save out as an Inkscape SVG and export the PNG. When you’re contributing a dozen or so icons, the time commitment is manageable. But my full themes have hundreds of icons in each set and I don’t have the time to convert them one-by-one.

If anyone knows of a better way to batch convert Illustrator PDF to SVG with results that don’t contain bitmaps, I’m open to suggestions.

I’m glad to hear you like my themes and it inspired you to mix it up.

#19

Made a powershell script to properly convert Ai pdfs to svg, the resultant svg is grouped and for some reason my machine needs the ungroup button to be clicked twice, but works.

Needs inkscape installed

Updated: add/remove/edit paths at the bottom to your liking, no spaces allowed.

Update 2: fix canvas sizes

Update 3: this script is pretty slow, if anyone wants more speed checkout the multi-threaded version: PDFtoSVG_MT in my github repo (you also need PDFtoSVG_MT_Worker)

# Alfrix 2017
# Batch Convert Ai PDF to SVG

cd "$env:programfiles\Inkscape"

echo ""
Write-Host "Converting Ai PDFs to SVG" -ForegroundColor Green
echo ""

function pdftosvg
{
	param([string]$pdf_path, [string]$svg_path)
	$pdfs = Get-ChildItem $pdf_path\* -Include *.pdf
	for ($i=0; $i -lt $pdfs.Count; $i++) {
		$pdf_fullname=$pdfs[$i].fullname
		$pdf_name=$pdfs[$i].basename
		Write-Host "Processing ",$pdf_path,$pdf_name -ForegroundColor Yellow
		.\inkscape.com -f "$pdf_fullname" -D -z -l="$svg_path\$pdf_name.svg"
		#alternative to inkscape
		#.\pdf2svg.exe "$pdf_fullname" "$svg_path\$pdf_name.svg"
		
		# the next bit is here to fix baxys pdfs which are in points
		$fix =  Get-Content "$svg_path\$pdf_name.svg"
		$fix=$fix -Replace 'width="341.33334"', 'width="256"'
		$fix=$fix -Replace 'height="341.33334"', 'height="256"'
		#$fix=$fix -Replace '256pt', '256' #for https://github.com/dawbarton/pdf2svg
		Set-Content -Path "$svg_path\$pdf_name.svg" -Value $fix
	}
}

# pdftosvg "input_path" "output_path"
# both paths must exist

$mainfolder="D:\Downloads\baxy-retroarch-themes-master"
pdftosvg "$mainfolder\retroactive\pdf" "$mainfolder\retroactive\svg"
pdftosvg "$mainfolder\retroactive\pdf_marked" "$mainfolder\retroactive\svg_marked"
pdftosvg "$mainfolder\systematic\pdf" "$mainfolder\systematic\svg"
pdftosvg "$mainfolder\baxy-retroarch-themes-master\monochrome_contributions\pdf" "$mainfolder\monochrome_contributions\svg"
pdftosvg "$mainfolder\baxy-retroarch-themes-master\neoactive\pdf" "$mainfolder\neoactive\svg"

pause
1 Like
#20

WOW! I’ll have to give this a shot next time I’m on a Windows computer. With Inkscape I’ve run into issues in the past with what I assume to be DPI differences between Illustrator and Inkscape. When I manually open a PDF icon source file in Inkscape, the 256x256 canvas opens at 320x320. Additionally, I have to resize the icon height or width to what I had it set in Illustrator (usually 248 in height or width). I’m not sure if your script accommodates for this issue, but I will look into it when I have a chance to give it a try.

I hate to even ask this, but how difficult would it be to adapt this as a command line script for Linux or macOS? All my themes were developed on a Mac and I use the X11 version of Inkscape for that platform. It’s clear I’m