I am working on a rebrand for Darktable 🌻

I’m a graphic designer, and recently used Darktable as a practice project — I would be delighted if the team liked it or wanted to use anything here. :sunflower: It includes a website homepage and icon redesign.

The website redesign is mostly an attempt to simplify and regroup elements. I wanted a design language that would work for many more pages.


The typography is all set in Fixel by Macpaw (open font license). This typeface feels modern, friendly and incredibly versatile with its variable font properties. :sunflower: I think its a good fit for Darktable.


The new icon inspired by the original aperture blades icon. It comes in two forms, round and square - following the Apple HIG guidelines from 1024px down to 16px.

The icon adjusts to stay sharp and clean at smaller sizes. The effects add a subtle sense of dimension, hopefully without feeling distracting or cheesy.


Thanks for viewing!

Had fun making this, would love for it to contribute somehow!

34 Likes

Regarding the app icon for macOS there is already a pull requesting waiting: PR #16918

2 Likes

Oh wow, this looks really nice!

3 Likes

DT needs a designer. :smile:

1 Like

@rudantu Welcome to the forum. The designs are quite accessible. Look forward to seeing more of your work.

Updates!

I have refined the icon a bit. Subtler effects and camera-inspired textures at large sizes. Again, pixel perfect down to 16x16.

I’ve started a website UX design in Penpot (an awesome FOSS UX Design project, similar to Figma). Penpot has collaborative multiplayer that I’d be keen to invite other users to join - you can then explore and build together in real time. Just hit me up. :fountain_pen::mailbox:

@patdavid I am aware you’ve been responsible for design and implementation of Darktable content. Does this project seem naive at all? Its been fun to imagine new designs but I know reworking everything will take some effort.

4 Likes

I like it a lot. I’ve been thinking of a redesign for a bit, but have lacked time and inspiration.

If you want to go further, keep in mind that it will need to be ported to Hugo and should have as little JavaScript as possible; the current site has none.

We also need improvements to our HTML documentation theme, which is extremely basic. :slight_smile:

2 Likes

@rudantu May I ask you to make a flat version of your darktable logo design?

I have doubts that we should go against the long-standing flat trend in logo design and add texture and gloss to our logo.

P.S. Checked out your site, great works.

6 Likes

+1. The shiny 3d candy look takes me back a couple of decades.
The logo is for me the only negative in your design. Otherwise, it looks great!

3 Likes

In my first career as a graphic designer, one of (if not the) first rules in logo design was, “It must work in black and white.” Only once that was true did color come into the design equation. The flat vs. 3D thing is kinda similar, IMO: Regardless of which it is, it must work consistently in all manifestations, sizes, colors and uses.

I like the 3D look to a degree (and personally think current flat designs are in general too flat / minimal), but it’s worth keeping in mind a logo is like an icon: It’s not an image, per se. It’s meant to represent something (a concept, service, product, whatever), not necessarily be a pictorial depiction of it. IMO for years icon / logo designs went too far into pictorial space, as it were. What happens at that point is, they can turn into hieroglyphics and get confusing.

Anyway, that said, the pictorial vs. iconic decision really isn’t a factor here since the darktable logo already exists. This is just an interpretation of it. But as far as my preferences go, a little depth / ‘substance’ is a good thing.

5 Likes

I appreciate the feedback! And yes I think the flat / rendered look is a balance. For the app icon I’ve gone from maybe 30% flat to 65% flat, much less shiny 3D. :sunflower:

I agree the logo should work as a pure SVG - so this has a ‘just gradients’ version without any fancy effects. Makes it lightweight and scalable for web etc.

All in all, the branding may look something like so:

17 Likes

This looks great!

I think I’d dial down the gradients a bit. Especially the blue blade is a bit too obvious.

And I’d say that the blade tips (and corners?) should be sharp, not rounded. These represent aperture blades after all, and those need to be sharp to form a round aperture.

Personally, I’d also dial down the curvature on the blades a bit. It seems a bit excessive for a lens aperture. But perhaps I’m taking the metaphor too literally.

1 Like

Looks good, just a few remarks:

  • The application icon should fit in with the theme used on the desktop if you want to keep an homogenous look there, for the logo you have of course more freedom. That may mean you’ll need two or three versions of the icons.
  • The red and orange are not well differentiated in the new version compared to the current version.
  • I think gradients should all have the same direction relative to the colour sector (which means 6 different orientations: 0°, 60°, 120°, 180°, 240°, 300°), and perhaps only change one aspect (chroma or lightness, perhaps not hue, as happens in the proposed icons: e.g. green → yellow, yellow → orange, ).

Wrt. the “aperture blades”: you normally don’t see the complete blades, only the parts not covered by other blades. That’s why the visible corners are always sharp, not rounded. Also, when the icons have sharp corners to the blades, the visual aspect will change less when going to smaller sizes (where rounded corners will end up sharpened)

1 Like

I actually really like it. It hints at the aperture without being over the top literal. At any rate its way more modern than what we have now.

Aren’t those usually provided by the icon pack?

1 Like

For all possible applications? darktable isn’t quite in the same league as e.g. LibreOffice or Firefox…

I mean if you want a particular style, like the super flat or the 3d or whatever. I don’t think we should make our icon fit some specific style in order to conform to one desktop environment or another.

1 Like

Of course that’s impossible (there are too many icon themes out there).

However, having a strong 3D icon in an otherwise “flat” theme (or vice versa) will be jarring. Having a few versions will mitigate that.

I think the icon here is a very nice inbetween. Very subtle.

Yes it certainly does

Very nice work! :ok_hand:t2:
I’d be delighted to see it in the release / source code !