Using Gimp to create a simple media player skin


Article from Issue 237/2020

Forget the photos – Gimp is also a great tool for graphic design. This workshop shows how to use Gimp to create a simple visual image for a multimedia player application.

Many users call on the Gimp image editor [1] to crop and touch up their digital photos, but the powerful Gimp has many other uses. For instance, developers and graphic artists use Gimp to create graphic elements for desktop applications. The details of how to tie graphics features into a working application are numerous and depend on the programming language, the desktop system, and the nature of the application. However, the steps for creating basic GUI elements in Gimp are often quite simple and serve as a useful scenario for showcasing Gimp's impressive toolbox of graphic design tools.

This workshop introduces you to some of the tools that graphic artists use to build images in Gimp. In this scenario, I'll build the skin for a sample media player application. Of course, the media player on your Linux system is a software tool that processes the contents of a stream or sound file. A media player doesn't really look like anything, but the metaphor of the computer desktop environment means that humans need something to look at. In this case, I'll make the media player look like an old-school CD player, with the usual buttons (Play, Stop, Previous, and Next) and a little window to show what song is playing. A more complete GUI interface would include an enlarged window for displaying playlists, as well as other elements, but for the purposes of this workshop, I'll keep it simple.

The popular Gimp comes preinstalled on many Linux systems, and if you can't find it now in the Start menu (typically with the Graphics applications), you can surely install it from your distro's package manager. The Gimp website also provides source code and packages for several operating systems [2]. This tutorial is based on Gimp version 2.10.14; if you are using a different version of Gimp, the details might differ slightly, but the concepts are similar.


Use Express-Checkout link below to read the full article (PDF).

Buy this article as PDF

Express-Checkout as PDF
Price $2.95
(incl. VAT)

Buy Linux Magazine

Get it on Google Play

US / Canada

Get it on Google Play

UK / Australia

Related content

  • Custom Text in GIMP

    GIMP offers plenty of options for creating custom text effects. We'll show you how to sweeten your text with bold outlines, tasty color, 3D effects, curves, and more.

  • Perl: Sharpen Images

    How do you sharpen a digital image? A short introduction to the principles and a Perl plugin for GIMP help amateur digital photographers polish their snapshots in a professional way.

  • Web Design with GIMP

    Good homepage design is a question of the layout. Sometimes the best option is to use a graphics program to design the page, then translate the result into HTML code. The versatile image manipulation program GIMP can help.

  • Pinta Image Processor

    Pinta is a simple, easy-to-learn image processor targeted at occasional users and beginners; more experienced users will miss a variety of features.

  • Animation with GIMP

    Although developed for editing individual images, GIMP has everything you need to create perfect animations via plugins and scripts.

comments powered by Disqus

Direct Download

Read full article as PDF:

Price $2.95