How To Theme Fedora
Download as ODP, PDF1 like1,429 views
The document discusses how to theme various components of Fedora, including: - Install-time graphics like boot media splash and installer banners use specific file formats, packages, and paths. - Boot-up graphics like the OS selection menu and graphical boot screen also have standardized formats and locations. - Ubiquitous desktop elements like the wallpaper, icons, window manager, and screensaver dialog can be customized following freedesktop specifications. - Resources for help include the Fedora Art mailing list and IRC channel. Proper testing and design principles like usability and licensing should be followed.
![Where To Go For Help The Fedora Art list: [email_address] Fedora Art Team IRC: #fedora-art on irc.freenode.net](https://image.slidesharecdn.com/3857472/85/How-To-Theme-Fedora-58-320.jpg)
How To Theme Fedora
- 1. How to Theme Fedora Máirín Duffy Interaction Designer, Red Hat, Inc. <duffy@fedoraproject.org>
- 2. What We'll Talk About Which parts of Fedora are themeable? (GNOME-focused, sorry!) What are good design principles and approaches to follow in creating a overall theme and each component? What tools are involved? What file formats, file locations, and package names are involved in applying new artwork? Where to seek help?
- 3. Why Theme Fedora? Help define 'upstream' Fedora's look! Create a unique look for your Fedora spin. Rebrand a non-Fedora derivative distro. Bling up and personalize your system.
- 4. General Design Principles Consider having a common thematic thread to unify the graphics (start => finish) Put more care into the design of those graphics which will be seen most often Accommodate as many screen resolutions and aspect ratios as possible (including dual) Don't distract or disrupt your audience. Consider space for translated text. Get feedback early and often!
- 5. More Tips Try not to consume too much disk space with graphics files Make the licensing of your graphics clear and the source artwork available. Test the graphics! Use them yourself over time. If you have a great idea that doesn't seem implementable – suggest it! Let folks know! Try remixing already available themes (art.gnome.org, gnome-look.org, etc.)
- 6. What's Typically Themed? Install-time graphics boot media splash, installer, first boot configuration Boot-up graphics kernel/os selection menu, graphical boot, login screen, desktop splash Ubiquitous graphics wallpaper, icons, window manager, widgets, cursors, screensaver dialog
- 10. Boot Media Splash Seen when booting from Fedora media. File format: PNG or JPG Package: fedora-logos, anaconda/syslinux-vesa-splash.jpg File path: /isolinux/splash.jpg Specification: 16-bit color per channel, 640x480, 65,536-color image. (This is a real weird one!) Workflow: Inkscape > Gimp > ImageMagick
- 11. Boot Media Splash How to test: Create a boot cd or usb stick and put the image in the isolinux directory of the cd as 'splash.jpg', boot it up
- 12. Installer
- 14. Installer Banner Seen throughout the install process. File format: PNG Package: fedora-logos, anaconda/anaconda_header.png File path: /usr/share/anaconda/pixmaps/anaconda_header.png Specification: 800x88px full-color + alpha PNG Workflow: Inkscape > Gimp
- 15. Installer Splash Seen at the beginning and installation phases of install process. File format: PNG Package: fedora-logos; anaconda/splash.png & anaconda/progress_first.png, anaconda/progress_first-lowres.png File path: /usr/share/anaconda/pixmaps/* Specification: 500x325px / 320x225px full-color + alpha PNG Workflow: Inkscape > Gimp
- 16. Installer How to test: Pop into #anaconda on irc.freenode.net and ask for help – it can be involved. How to take screenshots: Press Shift+PrtSc or PrtSc Shots wll be saved to /tmp/ramfs/anaconda-screenshots Tip: Other anaconda graphics to consider: about-to-install.png, done.png; icons: upgrade.png, install.png
- 17. Firstboot
- 19. Firstboot Banner Seen throughout the first boot process. File format: PNG Package: fedora-logos, firstboot/firstboot-left.png File path: /usr/share/firstboot/pixmaps/firstboot-left.png Specification: 160x600px full-color + alpha PNG Workflow: Inkscape > Gimp
- 20. Firstboot Splash Seen at the beginning of the first boot process. File format: PNG Package: fedora-logos, firstboot/splash-small.png File path: /usr/share/firstboot/pixmaps/splash-small.png Specification: variable size... but you'll probably want to keep it under 500x325px. full-color + alpha PNG file. Workflow: Inkscape > Gimp
- 21. First Boot How to test: Run '/usr/sbin/firstboot –debug' as root (make sure firstboot's gui is installed!) How to take screenshots: Press Shift+PrtSc or PrtSc Shots wll be saved to /root/firstboot-screenshots Tip: The icons displayed for each screen in firstboot are in the same directory as the banner and splash.
- 22. Boot-up graphics
- 25. OS Selection Menu Shown after BIOS when a system is booted. File format: xpm.gz Package: fedora-logos, bootloader/grub-splash.xpm.gz File path: /boot/grub/splash.xpm.gz Specification: 640x480px PNG file with 16-color indexed palette. 2 of the 16 colors are required, so you've got only 14 to play with. The required colors (and slot #s in the color map) are: 0 = #000000 (black), 1 = #ffffff (white)) Workflow: Inkscape > Gimp
- 26. OS Selection Menu How to test: Create xpm.gz using Gimp Replace ' /boot/grub/splash.xpm.gz ' on your system with new artwork Reboot! How to take screenshots: The easiest way is to run a virtualized copy of Fedora with your artwork replaced in it, and then take a screenshot of the VM window.
- 27. Graphical Boot
- 29. Graphical Boot Graphic Shown in the center while system starts up. File format: PNG Package: fedora-logos, /usr/share/rhgb/main-logo.png File path: /usr/share/rhgb/main-logo.png Specification: variable, might want to keep it within 500x350px, full-color + alpha PNG file. Workflow: Inkscape > Gimp
- 30. Graphical Boot Colors These colors are compiled into RHGB's code! :(
- 31. Graphical Boot How to test: Type 'rhgb -u $DISPLAY -i', then press Ctrl + Alt + D (Press Ctrl + Alt + D to get out of debug mode) How to take screenshots: Go into debug mode and take a screenshot. Tips: Other graphic possibilities exist: progress.png and system-logo.png
- 32. Login Screen
- 33. Login Screen
- 34. Login Screen Login screen. File format: XML Package: fedorainfinity-gdm-theme File paths: /usr/share/gdm/themes/$NAME/$NAME.xml /usr/share/gdm/themes/$NAME/GdmGreeterTheme.desktop Specification: See GDM Manual Workflow: Inkscape, Gimp, text editor
- 35. Login Screen How to test: 'export DOING_GDM_DEVELOPMENT = 1' 'Xnest -ac -geometry 1680x525 :123 &' 'DISPLAY=:123 /usr/bin/gdmgreeter' Tips: Consider using a theme from art.gnome.org or gnome-look.org as a basis. Doesn't have to have face browser. There is a lot of 'hidden' text you need – incorrect password, pam message, caps lock warning ...
- 36. Desktop Splash
- 38. Desktop Splash Shown in the center during login process. File format: PNG Package: fedora-logos File path: /usr/share/pixmaps/splash/gnome-splash.png (GNOME) Specification: variable, might want to keep it around 500x420px, full-color + alpha PNG file. Workflow: Inkscape > Gimp
- 40. Wallpaper
- 42. Basic Wallpaper Color is very important: Symbolically: Any time you use a color other than blue BE PREPARED TO JUSTIFY IT! :) Usability: too bright and you'll hurt people's eyes. Too dark and you will depress them. Avoid wallpaper artwork that will interfere with icon visibility – or look clickable. Depth is good. Simplicity is good. Have three basic sizes: Regular screen ratio, widescreen ratio, dual screen ratio.
- 43. Basic Wallpaper File format: PNG Package: desktop-backgrounds-basic File path: /usr/share/backgrounds/$NAME/$NAME.png Specification: Normal: 1600x1200 Wide: 2560 x 1600 Dual: 5200 x 3200
- 44. Wallpaper Set A set of wallpapers shown in the background chooser. File format: XML Package: desktop-backgrounds-basic File path: /usr/share/gnome-background-properties/desktop-backgrounds-$NAME.xml (default set is named desktop-backgrounds-basic.xml) Specification: Uses the gnome wallpaper format, see /usr/share/gnome-background-properties for examples.
- 45. Animated Wallpaper The animation is not noticeable – it is very gradual over time. If it moves too quickly it's distracting and wastes CPU. Can use to bring natural things to the desktop – movement of the sun and moon, growth cycle of plants, emotions of a character Be extra careful to watch your disk space usage!
- 46. Animated Wallpaper File format: XML Package: desktop-backgrounds-basic File path: /usr/share/backgrounds/$NAME/$NAME.xml Specification: Uses XML format to reference image files and specify transitions and timing. Please refer to /usr/share/backgrounds/infinity/infinity.xml for a commented example of the format.
- 47. Icons
- 48. Icon Theme File format: .theme (ini-style file) Package: desktop-backgrounds-basic File path: /usr/share/icons/$NAME/index.theme Specification: http://freedesktop.org/wiki/Specifications/icon-theme-spec?action=show Tip: You can modify the icons used by specific applications by modifying their .desktop files in /usr/share/applications. See: http://www.redhat.com/magazine/012oct05/features/freedesktop/
- 49. Window Manager
- 50. Window Manager File format: XML Package: nodoka-theme-gnome File path: /usr/share/themes/$NAME/metacity-1/metacity-theme-1.xml Specification: http://developer.gnome.org/doc/tutorials/metacity/metacity-themes.html
- 51. Widgets
- 52. Widgets File format: gtkrc Package: nodoka-theme-gnome File path: /usr/share/themes/$NAME/gtk-2.0/gtkrc Tools: the widget factory is a great tool for developing and testing GTK themes. (yum install thewidgetfactory) Specification: http://www.gtk.org/~otaylor/gtk/2.0/theme-engines.html
- 53. Cursors
- 54. Cursors File format: X cursor format. Package: redhat-artwork File path: /usr/share/icons/Bluecurve/cursors Specification: Generate PNGs for each cursor and use xcursorgen to create cursors. See: http://kde-look.org/content/show.php/Xcursor+Theme+Tutorial+!!!?content=11428
- 56. Screensaver Dialog File format: XML Package: fedora-logos File path: /usr/share/gnome-screensaver/lock-dialog-system.png (image), /usr/share/gnome-screensaver/lock-dialog-system.gtk (colors / style) Specification: No real restrictions on image size but you'll want it to be big enough to hold login information. Use the gtkrc format to modify colors of the widgets in the dialog.
- 57. Resources
- 58. Where To Go For Help The Fedora Art list: [email_address] Fedora Art Team IRC: #fedora-art on irc.freenode.net