Go Back   Cockos Incorporated Forums > REAPER Forums > REAPER Color Themes and Icon Sets

Reply
 
Thread Tools Display Modes
Old 09-21-2010, 04:35 AM   #41
EvilDragon
Human being with feelings
 
EvilDragon's Avatar
 
Join Date: Jun 2009
Location: Croatia
Posts: 24,790
Default

Quote:
Originally Posted by AdamWathan View Post
Cheers, that will help a lot actually! Still experimenting with the best option for these toolbar buttons but I'm sure it'll work itself out eventually...

I'm trying to keep it as neutral, clean, simple and easy on the eyes as possible, while keeping every element easily readable and understandable without having to look for it... It's coming along well so far but there's always challenges...

Am I too late?

http://www.mediafire.com/?5m94h4aa640gjqt
EvilDragon is online now   Reply With Quote
Old 09-21-2010, 05:53 AM   #42
AdamWathan
Human being with feelings
 
AdamWathan's Avatar
 
Join Date: Apr 2008
Location: Cambridge, Ontario
Posts: 2,644
Default

Quote:
Originally Posted by EvilDragon View Post
Hey ED thanks!

Now, forgive my n00bness, but how on earth can I easily apply any sort of styling to the icons themselves? Right now they are all black, so if I want them to be grey, I would have to select each one individually and change it to grey... I was hoping there was a way I could just have an "item foreground" which was a solid color, then apply the icon as a mask so that I wouldn't have to edit the color of every single icon individually...

What is the workflow for this? Again sorry, photo editing n00b :/
AdamWathan is offline   Reply With Quote
Old 09-21-2010, 06:12 AM   #43
EvilDragon
Human being with feelings
 
EvilDragon's Avatar
 
Join Date: Jun 2009
Location: Croatia
Posts: 24,790
Default

Well, I do it like so:

Select one layer named "normal". Apply blending effects. Done.
Select one layer named "hover". Apply different blending effects. Done.
Select one layer named "pressed". Apply yet again different blending effects. Done.

Right-click that layer named "normal", select "Copy layer style".
Select ALL other "normal" layers (hold Ctrl for non-contig selection), right click, select "Paste layer style".
Rinse&repeat for others.

Using Photoshop? Gosh I sure hope if you're not using PS but GIMP, that GIMP has this Copy/paste layer style commands. They're crucial to this method of mine!


P.S.: I just saw that I left my own layer blending effects inside. Thankfully, you can select all layers, right click and "clear layer style".
EvilDragon is online now   Reply With Quote
Old 09-21-2010, 06:21 AM   #44
AdamWathan
Human being with feelings
 
AdamWathan's Avatar
 
Join Date: Apr 2008
Location: Cambridge, Ontario
Posts: 2,644
Default

Quote:
Originally Posted by EvilDragon View Post
Well, I do it like so:

Select one layer named "normal". Apply blending effects. Done.
Select one layer named "hover". Apply different blending effects. Done.
Select one layer named "pressed". Apply yet again different blending effects. Done.

Right-click that layer named "normal", select "Copy layer style".
Select ALL other "normal" layers (hold Ctrl for non-contig selection), right click, select "Paste layer style".
Rinse&repeat for others.

Using Photoshop? Gosh I sure hope if you're not using PS but GIMP, that GIMP has this Copy/paste layer style commands. They're crucial to this method of mine!


P.S.: I just saw that I left my own layer blending effects inside. Thankfully, you can select all layers, right click and "clear layer style".
I'm actually using Pixelmator on Mac, no "Layer Style" copying and pasting as far as I can tell Photoshop is a bit too rich for my blood and Pixelmator is super intuitive so it works well for me... I'll do some digging around and find out if this is possible.

What I was doing before was creating a layer divided in 3 sections (normal,hover,pressed) and coloring each section however I wanted to style the icon itself. Then I would select an icon and apply that as a mask to the styled layer, so only the styled icon would be visible. Save, delete mask, apply mask using different icon, rinse, repeat.

How does the "Copy Layer Style" stuff work anyways, does it somehow intelligently apply the same styling to a differently shaped icon? Obviously I'm only coloring the black parts of the icon, so applying that same processing to a differently shaped icon must take some sort of intelligence on Photoshop's part to figure out what parts I want colored and how since it is comparing two different images?
AdamWathan is offline   Reply With Quote
Old 09-21-2010, 06:28 AM   #45
EvilDragon
Human being with feelings
 
EvilDragon's Avatar
 
Join Date: Jun 2009
Location: Croatia
Posts: 24,790
Default

I guess that masking you're talking about does about the same, perhaps?

For example, in PS, you have these layer blending effects, like drop shadow, emboss, bevel, outer glow, inner glow, and for our case more important - color overlay and gradient overlay. Overlays don't apply to transparent parts of the layer, so they're perfect for our icons.

So, basically I pick a color (or gradient) to be used on an icon state i need (normal/hover/pressed), and apply it to the layer. I can always turn off the layer blending to see the raw layer. Then I can copy layer style (Photoshop knows I only used Color overlay with THAT particular settings), and paste that particular style to any number of other selected layers (Photoshop will apply those same Color overlay settings to those layers).

I can also save the blending effects as a Style preset, and use it by click of a button later on. Amazing stuff

I'd make a GIF for this, but I'd need to capture the whole 1920x1080 of my screen estate (well, at least for the better part), but it would be a really big GIF.

EDIT: to hell with it, I recorded only part of the screen, 2.3 MB GIF -> http://img713.**************/img713/7804/layerstuff.gif

Last edited by EvilDragon; 09-21-2010 at 06:36 AM.
EvilDragon is online now   Reply With Quote
Old 09-21-2010, 06:33 AM   #46
AdamWathan
Human being with feelings
 
AdamWathan's Avatar
 
Join Date: Apr 2008
Location: Cambridge, Ontario
Posts: 2,644
Default

Yeah looked it up and I understand how it works, very cool!

Pixelmator doesn't have 'em though My method works well enough, but still a LOT slower than having layer styles would be...
AdamWathan is offline   Reply With Quote
Old 09-21-2010, 06:41 AM   #47
AdamWathan
Human being with feelings
 
AdamWathan's Avatar
 
Join Date: Apr 2008
Location: Cambridge, Ontario
Posts: 2,644
Default

Quote:
Originally Posted by EvilDragon View Post
EDIT: to hell with it, I recorded only part of the screen, 2.3 MB GIF -> http://img713.**************/img713/7804/layerstuff.gif
Wow that looks a lot easier in Photoshop :/
AdamWathan is offline   Reply With Quote
Old 09-21-2010, 06:51 AM   #48
EvilDragon
Human being with feelings
 
EvilDragon's Avatar
 
Join Date: Jun 2009
Location: Croatia
Posts: 24,790
Default

Sorry it can't help you

http://www.smashingmagazine.com/2009...ace-photoshop/

Seems like GIMP can approach this Photoshop workflow, at least to some extent...

Last edited by EvilDragon; 09-21-2010 at 06:56 AM.
EvilDragon is online now   Reply With Quote
Old 09-21-2010, 07:42 PM   #49
AdamWathan
Human being with feelings
 
AdamWathan's Avatar
 
Join Date: Apr 2008
Location: Cambridge, Ontario
Posts: 2,644
Default

Killed the glow on the FX/IO buttons and finished the frameless toolbar buttons... Having second thoughts about them though, they don't really seem to belong :/ I don't want to make every single button flat, it wouldn't work for a lot of elements anyways so I don't know what to do. It looks a bit like a mish mash to me right now, not enough continuity between the styles of every element...



I really want this theme to be super simple, clean and non-distracting. Like the UI for Adobe Premiere for example, but maybe a little less ugly. So far the GUI in Nuendo 5 is the only thing I've seen that I really like in that regard. I want it to be 99% grey, only using colors when it's absolutely necessary to identify that something is active... Harumph.
AdamWathan is offline   Reply With Quote
Old 09-21-2010, 08:41 PM   #50
narcossintese
Human being with feelings
 
Join Date: Dec 2009
Posts: 33
Default

I think they look better flat. At first I was not sure about the dark glossy middle bar (with the transport buttons and BPM), but now that you´ve made it flat I think I like the glossy one better lol

The theme is already gorgous at it is, I don´t think I have any other point to make. It is pretty much flawless IMO. The theme I would like to have done and I´m really glad that you decided to make something with this approach. It´s also very easy to mod it to other colors instead of green. Red and blue comes to mind.

Last edited by narcossintese; 09-21-2010 at 08:47 PM.
narcossintese is offline   Reply With Quote
Old 09-22-2010, 12:31 AM   #51
bluzkat
Human being with feelings
 
bluzkat's Avatar
 
Join Date: Jun 2007
Location: Northern Michigan
Posts: 6,919
Default

Adam,

This theme is looking really good, *but* is it possible to include the transport 'buttons' also? I think the flat buttons on the transport don't fit very well with the rest of the theme (which is beautiful).


__________________
Peace...
bluzkat
bluzkat is offline   Reply With Quote
Old 09-22-2010, 02:36 AM   #52
EvilDragon
Human being with feelings
 
EvilDragon's Avatar
 
Join Date: Jun 2009
Location: Croatia
Posts: 24,790
Default

Toldya. Make a flat and non-flat theme mods, and users can mix&match if they will


I for sure think 100% flat theme would be interesting!
EvilDragon is online now   Reply With Quote
Old 09-22-2010, 02:56 AM   #53
charmander
Human being with feelings
 
Join Date: Aug 2010
Posts: 116
Default

Quote:
Originally Posted by EvilDragon View Post
Toldya. Make a flat and non-flat theme mods, and users can mix&match if they will


I for sure think 100% flat theme would be interesting!
+1, its all happening on a flat screen anyways.
charmander is offline   Reply With Quote
Old 09-22-2010, 03:38 AM   #54
bluzkat
Human being with feelings
 
bluzkat's Avatar
 
Join Date: Jun 2007
Location: Northern Michigan
Posts: 6,919
Default

Quote:
Originally Posted by EvilDragon View Post
Toldya. Make a flat and non-flat theme mods, and users can mix&match if they will


I for sure think 100% flat theme would be interesting!
A flat theme would be cool (but not this one,please?).


__________________
Peace...
bluzkat
bluzkat is offline   Reply With Quote
Old 09-22-2010, 04:15 AM   #55
EvilDragon
Human being with feelings
 
EvilDragon's Avatar
 
Join Date: Jun 2009
Location: Croatia
Posts: 24,790
Default

Yes, this one!!!
EvilDragon is online now   Reply With Quote
Old 09-22-2010, 06:51 AM   #56
AdamWathan
Human being with feelings
 
AdamWathan's Avatar
 
Join Date: Apr 2008
Location: Cambridge, Ontario
Posts: 2,644
Default

Quote:
Originally Posted by EvilDragon View Post
Toldya. Make a flat and non-flat theme mods, and users can mix&match if they will


I for sure think 100% flat theme would be interesting!
I barely have the energy to finish one version let alone two, so that isn't gonna happen, sorry... The flat one won't work because if I remove the buttons on the TCP, the text inside the button will be practically invisible when the track is selected...

I'm gonna have to add buttons to the toolbar I think, same with the transport, just have to figure out a way to make them not look ugly as hell. When it's done, anyone else is more than welcome to take a stab at doing a flat version :P
AdamWathan is offline   Reply With Quote
Old 09-22-2010, 07:29 AM   #57
bluzkat
Human being with feelings
 
bluzkat's Avatar
 
Join Date: Jun 2007
Location: Northern Michigan
Posts: 6,919
Default

Adam,

Sorry no flat theme.

Yeah!! *buttons*.

Waiting patiently...


__________________
Peace...
bluzkat
bluzkat is offline   Reply With Quote
Old 09-22-2010, 07:42 AM   #58
Kundalinguist
Human being with feelings
 
Kundalinguist's Avatar
 
Join Date: Nov 2008
Location: Toronto, Canada
Posts: 4,630
Default

With a name like "Cattleist" I was expecting perhaps a rawhide background with horns on the faders. But wait, I think I've misread the post. Never mind...
__________________
Success is just one more plugin away! And happiness is as close as your next upgrade. (On the interweb: www.rolandk.ca / www.auroraskypublishing.com)
Kundalinguist is offline   Reply With Quote
Old 09-22-2010, 08:08 AM   #59
EvilDragon
Human being with feelings
 
EvilDragon's Avatar
 
Join Date: Jun 2009
Location: Croatia
Posts: 24,790
Default

Quote:
Originally Posted by AdamWathan View Post
I barely have the energy to finish one version let alone two, so that isn't gonna happen, sorry... The flat one won't work because if I remove the buttons on the TCP, the text inside the button will be practically invisible when the track is selected...

I'm gonna have to add buttons to the toolbar I think, same with the transport, just have to figure out a way to make them not look ugly as hell. When it's done, anyone else is more than welcome to take a stab at doing a flat version :P
Please save what you have flat already to a separate location, I might wanna give it a shot at turning this into a flatter theme.
EvilDragon is online now   Reply With Quote
Old 09-22-2010, 09:37 AM   #60
narcossintese
Human being with feelings
 
Join Date: Dec 2009
Posts: 33
Default

Quote:
Originally Posted by AdamWathan View Post
I'm gonna have to add buttons to the toolbar I think, same with the transport, just have to figure out a way to make them not look ugly as hell.
The flat middle bar look a bit poor without the buttons/frames of the original RADO. Maybe you could use the original RADO style (that look good) until/if you think of something else better. IMO the black glossy version looks good without buttons/frames.


Now I realized that the frameless buttons on the toolbar can be a problem with "only text" custom buttons, specially on the MIDI editor. You can make minimalistic and elegant flat square buttons like you did on the "locked pad" on this screenshot:
http://dl.dropbox.com/u/3616293/catalyst-sept20-2.png

But, instead of frameless when disactivated, you could keep the frame and just make the whole button on a lighter shade of grey (less distracting than green).

They look better and cleaner than the RADO ones (with screws on the corners) and fit better on the theme than the rounded border ones (from Blender, I guess).
narcossintese is offline   Reply With Quote
Old 09-22-2010, 09:42 AM   #61
EvilDragon
Human being with feelings
 
EvilDragon's Avatar
 
Join Date: Jun 2009
Location: Croatia
Posts: 24,790
Default

When I updated the icons for RADO, I removed the dots in corners. Now it looks much cleaner to me
EvilDragon is online now   Reply With Quote
Old 09-22-2010, 09:57 AM   #62
AdamWathan
Human being with feelings
 
AdamWathan's Avatar
 
Join Date: Apr 2008
Location: Cambridge, Ontario
Posts: 2,644
Default

I think I'm going back to the rounded corner buttons, but no green, and I'm going to change them from the lighter gray so that they match the color scheme of the TCP and MCP buttons. I think that will keep the theme looking nice and uniform. Don't know what to do for the "on" state of the buttons though... Maybe just lighter background and lighter icon... I'd really like to somehow make black on gray buttons that look nice but it seems impossible. The Nuendo 5 buttons for example have a light gray background with a dark icon and look great, but every attempt I've made in Reaper looks like SHIT! :/

Thankfully, I built a Pixelmator template that makes exporting buttons a joke now. I used the "slice for web" tool and just placed all the buttons on one image, set it up so that they are all masks and I just change a background color that changes every single icon at the same time, then hit "Export" and it cuts them all up pre-named
AdamWathan is offline   Reply With Quote
Old 09-22-2010, 01:34 PM   #63
Amberience
Human being with feelings
 
Amberience's Avatar
 
Join Date: Oct 2006
Location: swing on the spiral of our divinity
Posts: 2,242
Default

Very clear Adam!! I can't wait for this theme dude!
Amberience is offline   Reply With Quote
Old 09-22-2010, 02:27 PM   #64
bluzkat
Human being with feelings
 
bluzkat's Avatar
 
Join Date: Jun 2007
Location: Northern Michigan
Posts: 6,919
Default

Quote:
Originally Posted by Amberience View Post
Very clear Adam!! I can't wait for this theme dude!
Most definitely!!


Hey Drew... how the hell are you??


__________________
Peace...
bluzkat
bluzkat is offline   Reply With Quote
Old 09-22-2010, 02:47 PM   #65
bfsound
Human being with feelings
 
Join Date: Aug 2010
Posts: 160
Default

WOW currently i use default theme because i have not seen anything that really catches my eye, but i could stand to look at this everyday amd cant wait till the release!A few things though i like the flat tool bar but would like the transport to all look like the TC area where its darker like u had in this version :
Attached Images
File Type: jpg catalyst-sept20-2.jpg (64.8 KB, 259 views)
bfsound is offline   Reply With Quote
Old 09-22-2010, 02:51 PM   #66
Amberience
Human being with feelings
 
Amberience's Avatar
 
Join Date: Oct 2006
Location: swing on the spiral of our divinity
Posts: 2,242
Default

Quote:
Originally Posted by bluzkat View Post
Most definitely!!


Hey Drew... how the hell are you??


I am really well dude
Amberience is offline   Reply With Quote
Old 09-22-2010, 04:18 PM   #67
jdutaillis
Human being with feelings
 
jdutaillis's Avatar
 
Join Date: Apr 2010
Location: Sydney, Australia
Posts: 521
Default

Quote:
Originally Posted by bfsound View Post
WOW currently i use default theme because i have not seen anything that really catches my eye, but i could stand to look at this everyday amd cant wait till the release!A few things though i like the flat tool bar but would like the transport to all look like the TC area where its darker like u had in this version :
+1 to this!

Infact, I think the theme was at its peak here. I for one like the toolbar buttons rather than the flat version. I do like how you removed the glow from the track bottons though.

Love the green and grey colours as well!
__________________
Sound Recordist | Sound Designer |Sound Mixer
REAPER | Prism Sound Orpheus | Genelec 8020a + 7050B
Check out my website HERE
jdutaillis is offline   Reply With Quote
Old 09-22-2010, 05:30 PM   #68
bfsound
Human being with feelings
 
Join Date: Aug 2010
Posts: 160
Default

ACtually after futher looking at it i think you had it about nailed on the head in the one i attached to my last post. Im about 60% towards the toolbar buttons and about 40 towards the flat. I think im ready for a download any update on a release?
bfsound is offline   Reply With Quote
Old 09-22-2010, 06:09 PM   #69
AdamWathan
Human being with feelings
 
AdamWathan's Avatar
 
Join Date: Apr 2008
Location: Cambridge, Ontario
Posts: 2,644
Default

Quote:
Originally Posted by bfsound View Post
ACtually after futher looking at it i think you had it about nailed on the head in the one i attached to my last post. Im about 60% towards the toolbar buttons and about 40 towards the flat. I think im ready for a download any update on a release?
There's still a bunch of stuff to do that I haven't even touched and tons of theme colors that I haven't changed because I haven't used the features where they show up So maybe I will release a "beta" version on the weekend and you guys can help me out.
AdamWathan is offline   Reply With Quote
Old 09-22-2010, 06:14 PM   #70
bfsound
Human being with feelings
 
Join Date: Aug 2010
Posts: 160
Default

Quote:
Originally Posted by AdamWathan View Post
There's still a bunch of stuff to do that I haven't even touched and tons of theme colors that I haven't changed because I haven't used the features where they show up So maybe I will release a "beta" version on the weekend and you guys can help me out.
Please do id like to get my hands on it as is, with or with out the flat toolbar but with the darker transport and TC backing

keep us updated
bfsound is offline   Reply With Quote
Old 09-22-2010, 06:15 PM   #71
AdamWathan
Human being with feelings
 
AdamWathan's Avatar
 
Join Date: Apr 2008
Location: Cambridge, Ontario
Posts: 2,644
Default

Quote:
Originally Posted by bfsound View Post
Please do id like to get my hands on it as is, with or with out the flat toolbar but with the darker transport and TC backing

keep us updated
TC Backing? Sorry I'm not sure what you mean, please clarify so I don't forget about something! Thanks!
AdamWathan is offline   Reply With Quote
Old 09-22-2010, 06:48 PM   #72
EvilDragon
Human being with feelings
 
EvilDragon's Avatar
 
Join Date: Jun 2009
Location: Croatia
Posts: 24,790
Default

TCP background?
EvilDragon is online now   Reply With Quote
Old 09-22-2010, 06:56 PM   #73
AdamWathan
Human being with feelings
 
AdamWathan's Avatar
 
Join Date: Apr 2008
Location: Cambridge, Ontario
Posts: 2,644
Default

Quote:
Originally Posted by EvilDragon View Post
TCP background?
That's what I thought as well but nothing was ever mentioned previously about it not being dark enough? Haha I'm not sure!
AdamWathan is offline   Reply With Quote
Old 09-22-2010, 07:20 PM   #74
Lazz
Human being with feelings
 
Join Date: Jan 2009
Posts: 390
Default

Myself, I love the buttons in both spots, I really hope they end up on there...I feel its a clarity thing IMO..

Is there a way to use the original gray buttons in the first pic you posted but when "on" have everything thats light gray be the matching green? Would have to see it but Im thinking this would look great...or maybe not haha!

Absolutely Love this theme...Cant Wait!
Lazz is offline   Reply With Quote
Old 09-22-2010, 10:22 PM   #75
jdutaillis
Human being with feelings
 
jdutaillis's Avatar
 
Join Date: Apr 2010
Location: Sydney, Australia
Posts: 521
Default

Quote:
Originally Posted by AdamWathan View Post
TC Backing? Sorry I'm not sure what you mean, please clarify so I don't forget about something! Thanks!
I Think he meant Time Code. As in the area around the time on the transport bar.
__________________
Sound Recordist | Sound Designer |Sound Mixer
REAPER | Prism Sound Orpheus | Genelec 8020a + 7050B
Check out my website HERE
jdutaillis is offline   Reply With Quote
Old 09-25-2010, 08:44 AM   #76
AdamWathan
Human being with feelings
 
AdamWathan's Avatar
 
Join Date: Apr 2008
Location: Cambridge, Ontario
Posts: 2,644
Default

Haven't done much work on this lately but I think I'm happy with the toolbar buttons now...

AdamWathan is offline   Reply With Quote
Old 09-25-2010, 08:49 AM   #77
EvilDragon
Human being with feelings
 
EvilDragon's Avatar
 
Join Date: Jun 2009
Location: Croatia
Posts: 24,790
Default

It's true that they fit in better with the theme now...
EvilDragon is online now   Reply With Quote
Old 09-25-2010, 09:24 AM   #78
bluzkat
Human being with feelings
 
bluzkat's Avatar
 
Join Date: Jun 2007
Location: Northern Michigan
Posts: 6,919
Default

Toolbar buttons look great!

Soon???

__________________
Peace...
bluzkat
bluzkat is offline   Reply With Quote
Old 09-25-2010, 09:56 AM   #79
AdamWathan
Human being with feelings
 
AdamWathan's Avatar
 
Join Date: Apr 2008
Location: Cambridge, Ontario
Posts: 2,644
Default

Quote:
Originally Posted by bluzkat View Post
Toolbar buttons look great!

Soon???

Hooopefully... Still got lots to do, think I might have to go a different route with the transport because those buttons get re-used in the MIDI Editor and end up looking funky.
AdamWathan is offline   Reply With Quote
Old 09-25-2010, 12:44 PM   #80
bfsound
Human being with feelings
 
Join Date: Aug 2010
Posts: 160
Default

The last posted version looks sweet! When i said TC area i meant transport/ bar that whole area. Looks good id take it like that any day.

Cant wait
bfsound is offline   Reply With Quote
Reply

Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT -7. The time now is 04:54 AM.


Powered by vBulletin® Version 3.8.11
Copyright ©2000 - 2024, vBulletin Solutions Inc.