preview of yet another untitled skin

[OtisBee]

hi!

here's an early screenshot of the skin i'm currently working on.

http://i30.tinypic.com/2jbl5y9.png

well, obviously this is some sort of a HUD skin. :D
...and again it is my purpose to implement as much features that CAD has to offer as possible in this skin.

appart from the regular elements like ratings, tool-, volume- and progressbar i'm also thinking about adding each and every supported button (settings, show/hide player, minimize, exit, shuffle, repeat).

if everything works out nicely i hopefully can create a cool effect by using the extended panel.
i won't tell too much about that anyway, so i'd be able to keep some surprises for the final release. ;D

i also want some smooth cover transitions and perhaps an eye-candylike special effect. not sure what it will be, though. :)

maybe i'll change the time tag appearance again, because i have another alternative (or maybe two) in my mind.

well, since the skin isn't even a skin yet (for it only exists as a psd file so far) there's a lot of work in order to make it come to life (so to speak).

now...
...as you've seen in this thread's title, the skin doesn't have a name yet.
okay, i often like to play upon words, but the name definitely won't be GeeHUD or PizzaHUD. ;D

who knows...
...maybe you have some suggestions on the name or any other part of this skin.
perhaps there's a cover transition style you've seen in another skin and you think it would look just great in this HUD-like skin as well.

okay, that's all for now.


anxious for your feedback....


....OtisBee
;)

[Carlos]

Wow! :o

Awesome!

thaHUD :)

[Operator]

Why not PizzaHUD, it's a great name! ;D


Seriously: Great concept, WOW!


I know your skin doesn't exist at the moment, but hopefully it's okay to give some feedback: The tags for Artist, title and so on could be hard to read with the actual color, so maybe you want to choose a brighter color. But I can imagine that you will do this during the creative progress of making this skin ;).


Another thing I came up with affects color transistion: I always wanted to see some kind of "water"-effect, like a stone drops into the water and it waves. Something similar to "Stargate :D.


I'm also thinking about adding some transparency to the main window of the skin. Could look cool. Together with a nice "Aero"-filter, it could be pretty amazing, I believe. Since you don't have Vista, I could help you with that.


Finally [to come to an end], I would like to make a small request: Would it be possible to add a smaller substyle to the finished skin? The actual mockup looks kinda big and would need a lot of space on the Desktop [my resolution is "only" 1280x1024 ;)]


Again: Great concept so far and I'm really excited to see more of your baby! :)

[OtisBee]

thx for your feedback guys!
:D

@ Operator:

i very much appreciate your criticism and suggestions. :)

the water ripples are quite a challenge and i already have an idea how to maybe accomplish that.
however i still have to see if it would work or even look nice. ;)

brighter artist-, title- or albumtags is in my consideration as well as a more transparent appearance of the skin.
i'll make some tests.

for now i don't know if the skin will finally feature a smaller substyle.

first things first. ;)


thx again....


....OtisBee

[musashi]

Wow Perfect work how ever Otis.i love your screenario but i must say that would be your best work looks so cool cant wait up for it

[Mike1959]

excellent work as always...professional graphics but a tad dark for my tastes but as always an excellent addition to your collection.

(a brushed metal version may also be a nice addition to this further down the line perhaps?...just a thought.)

I'm guessing you use Photoshop to create your graphics for your projects?
judging by the quality of them I'd assume so.

Mike.

[OtisBee]

@ musashi:

wow!
i appreciate it so much that you seem to only have registered to tell me this.
well, there might be other reasons of course, but it's still nice to know that your first post was made to give me that feedback.

thank you so much!
:D


@ Mike1959:

thx for your feedback as well. ;D
since i'm a big fan of rather dark WB themes or visual styles in general, i started to created this skin to have the actual dark appearance so it would match my current setup.
however it is possible to add further styles (a brushed metal version is a great idea btw) once the skin is ready and released.
i think it's the way it will be. the default first and additional styles to follow the initial release then. :)

thx again...
:D


@ all:

i think an early version for beta testing can be expected by early next week.
so, please be patient for another few days.
;D


....OtisBee

[OtisBee]

hi!

having considered most of your recent suggestions, it's time to post another screenshot. ;D

http://i30.tinypic.com/j8z7h0.jpg

in clockwise direction starting from top left you can see the styles:


default
brushed metal
slightly transparent
blue steel


the main difference to my first screenshot is that i've applied a soft dropshadow to all the tiny buttons.
in addition the screenshots weren't taken from a psd file anymore.
all styles are ready to use and if you'd contact me via email (not PM) i'd be glad to send you a copy.


however here are some things you should keep in mind:

-a new CAD build is necessary to use the skin without complications. since Carlos hasn't released that build yet, i might be able -assuming that Carlos would give his permission- to add that build to the skin's archive.

-although the skin is already fully functional there are still quite a few things missing (i.e. nocover images, cover transitions, a possible special effect or mouseover effects on both the extended panel hotspot and the volumebar). so no need to make suggestions for those elements. ;)

-depending on both your suggestions and my ideas, the skin can still change its appearance. in other words... ...the process of creating this skin has not reached the final stage yet. :)


apart from any other opinion or suggestion you might have in mind, i'm very interested in your ideas about...

...whether or not the toolbar needs some play/pause symbols or even a mouseover effect

...a possible titlebar text reading for example: "CD Art Display" or "ThaHUD" (not sure yet, but the latter might be the final name for this skin)

...any additional styles in different textures or colors

...the current progressbar appearance, because this is actually the element i feel (if at all) most uncomfortable with right now, although i can't really specify WHY exactly. :-\

still anxious for your feedback....


....OtisBee

[Carlos]

As I said before it's an impressive skin! :)

- text lines: the gradient mask could be smaller giving more space to a 100% visible text; longer titles are hard to read

- Play button: it'll be nice to see a play symbol just for this button (something subtle); maybe a test here so we can decide? ;)

- Progress bar: while testing the skin the progress bar was always in the right place for me; I like the way it is right now

- "Lyrics button": after testing the skin I have a felling that a lyrics button would fit well here (at least the skin has room for it)... Maybe I should add another button to CAD toolbar... What do you think?

[OtisBee]

thanks Carlos! :)

- text lines: the gradient mask could be smaller giving more space to a 100% visible text; longer titles are hard to read

do you think a decreasing of the maximum letters for the according textlines in order to let the scrolling start earlier (before unreadability) would do the trick?
basically this would be the solution i prefer. ;)

- Play button: it'll be nice to see a play symbol just for this button (something subtle); maybe a test here so we can decide?

i'll have some tests and then i post some various screenshots.

- Progress bar: while testing the skin the progress bar was always in the right place for me; I like the way it is right now

cool! :D

- "Lyrics button": after testing the skin I have a felling that a lyrics button would fit well here (at least the skin has room for it)... Maybe I should add another button to CAD toolbar... What do you think?

actually i already thought about adding a lyrics button as part of the extended panel.
since i haven't configured a fourth textline there it could be done by having a %lyrics% link-tag to be displayed over a button.
however the lyrics button would only show up on an opened extended panel then, so i guess an additional lyrics button in toolbar would be the better solution.
great idea. :D

thx for your feedback!


....OtisBee

[Carlos]

thanks Carlos! :)

- text lines: the gradient mask could be smaller giving more space to a 100% visible text; longer titles are hard to read

do you think a decreasing of the maximum letters for the according textlines in order to let the scrolling start earlier (before unreadability) would do the trick?
basically this would be the solution i prefer. ;)

...



I think it can work. :)

[Operator]

The new screenshot looks really cool, so far "Brushed Metal" and "Slightly Transparent" are my favourites :).


- Play/Pause Symbol: Looks good without, but you can try to add those symbols only on mouseover. Maybe with a "sunken"-style.


- Titlebar Text: Please, no! It looks perfect the way it is


- Additional Styles: Maybe a "Unified"-Theme? So to speak a Brushed Metal theme without the Brushed Metal, you know? ;)


- Progress Bar: If the progress bar is the thing above the play-button, then please keep it that way. Looks just right for me on the screenshot.



Btw: The Volume-Bar is the thing above the Shuffle/Repeat buttons, right? Looks a little bit misplaced on "Brushed Metal" and "Blue Steel", maybe because of the missing line, but I'm not really sure...


That's it so far and now I'll have to write a mail begging for that skin ;)

[Carlos]

...
Btw: The Volume-Bar is the thing above the Shuffle/Repeat buttons, right? Looks a little bit misplaced on "Brushed Metal" and "Blue Steel", maybe because of the missing line, but I'm not really sure...
...


I agree. The line is a nice touch. IMO keep it for all styles! :)

[Mike1959]

if like me 'Otis' you may have found that the 'line' Carlos speaks of didn't have the same impact as it does on the original skin...
yes I agree it does look better with than without but doesn't always look as effective on some colours for some unknown reason.
looks like we're back to that 'personal choice' again...:)

[OtisBee]

hi!

actually it was my intention to keep that thin line in all styles, but when i created the metallic styles i saved the case.png's to quickly and then soon after i have posted the screenshot i noticed that i forgot about the thin lines. :-\

however i agree with Mike1959 that this thin line doesn't always look as effective on some colors.

btw...
...that does not only apply to the thin line, but to almost every inset effect if used on a rather bright skin style like that brushed metal for example.
also the button surrounding outlines are less visible in that brushed metal style (and any possible bright style to come).

i'll fix that. ;)

thx again for your feedback and please let me repeat my offer to send you a recent beta of my skin. just send an email and you'd soon be able to test the skin in action. :D
in case you already have an early beta, there's no need to contact me again. i'd supply you with an update as soon as some significant changes to the skin would be made. ;)


....OtisBee

[OtisBee]

hi!

i made some tests on the play/pause button symbol and here are some possible results:

http://i25.tinypic.com/2cr6k4h.png

although it seems that all buttons look very similar it takes a close look to point out the actual differences.

1 - an inner shadow only
2 - the same inner shadow plus a subtle outline
3 - same as above plus a downward inner bevel
4 - like no.2 plus a slight inset bevel on the outside

i know it's a matter of taste, but i think it would be quite helpful if i could get some feedback and then mix that with my own opinion. ;D

btw. a 5th solution could be to do it completely without a play/pause symbol. ;)

please tell me what you think.

thx!

[Carlos]

I like number 2 and I think a symbol would look nice, even better than without it. :)

[Operator]

I like No. 2 & 3 a lot, but prefer rather No. 3 than 2.

[Mike1959]

yep 2 for me also...the outline helps define it better I feel.

[OtisBee]

thx for your opinions!
:D

for a better impression of how the symbols would look in action here's a new screenshot showing 3 additional styles:

http://i25.tinypic.com/bgy6f4.png

from top to bottom: Dark Steel, Blood Steel and Metal

__________________________________________________ ______________________________

what's new (or different):


better accesibility for the progressbar.
lyrics button added
play/pause symbols on the play/pause button
that thin line is part of every style now
tweaked the inset bevel appearances on all bright skin styles
maximum letter amount decreased in textlines 1, 2 and 3
configured a blur effect to the transparent skin style by using values sent by Operator


contact me via email for a beta version of this skin.

thx!
;D


....OtisBee

[OtisBee]

...and here's how a lyrics viewer might look like

http://i25.tinypic.com/v6jink.png

:)

[Mike1959]

ooooo I do like that 'lyric viewer' Otis very effective indeed especially with the opaque effect...an excellent plus to the skin.

[Carlos]

Yes! The lyrics viewer is really cool! Well done my friend! :)

[OtisBee]

thank you guys!
:D


...since i got some reports lately via email that there are some problems with the readability of the lyrics in the topmost viewer area, i decided to post my reply here, instead of writing several emails dealing with the same subject. ;)

you see, the appearance of the lyrics text is highly dependent from the wallpaper you're using.
as you know the lyrics viewer is created to feature a rather transparent background with some additional mask images overlaying the top and bottom of the lyrics to give some fade in/out impression.
these mask images are designed to become more and more opaque the more they would reach the borders of the assigned lyrics area.
so this is basically the reason why the textlines appear to become darker and somewhat harder to read at both the top and bottom of the viewer.
what makes it even more complicated (so to speak), is that i've configered a halo (about 10% opacity) to the lyrics.

so if you for example are running this skin on a very bright wallpaper it is selfexplanatory that the viewer seems to be more transparent than on darker walls. in addition it is more difficult to read the bright font colors i've chosen.

well, personally i prefer the darker wallpapers and so i don't quite experience the trouble you do.
not willing to change either opacity or font appearance i sadfully have to say that it's up to you to make the according changes in CAD's skin editor.
so, here are some tips that might take you to an improved readability in terms of the lyrics:

make sure to switch of the halo effect in skin editor (Lyrics >> Text >> Outline and Shadow) and maybe configure some soft dropshadow instead in order to increase the overall text contrast for the lyrics text.

also you can set a higher value in Text position fine adjustment >> Top which would move the first displayed lyrics textline further away from the top and therefor would let the lyrics start in a more readable area of the viewer.
the changes you would make only have effect on the text inside of the assigned lyrics area. this way you can move the lyrics without causing them to leave the viewer or to stop them from still using the entire viewer display if you would scroll up or down the lyrics. ;)

i hope that my tips are helpful to conquer your trouble in reading the lyrics. ;D


@ Carlos:

you've mentioned it quite a few times and i always forgot to mention that YES, i'm planning to add a hotspot button for the extended panel with all sorts of mouseover states. ;D

oh...
...btw, there was a question (or maybe a request) by Operator who asked if it would be possible to display artist and/or title somewhere in the titlebar of the lyrics viewer. this might be something for you to answer, since this isn't really a design matter. :D


@ Operator:

symbols for the toolbar's next- and previousbutton are not really on my todo list, but i agree that the play/pause symbol looks kinda lost the way it is now. however i tend to switch back to a completely naked toolbar (like it was first) rather than to add further symbols.
i think the concept of a three-buttoned-toolbar is kinda selfexplanatory and doesn't really need additional symbols to explain the functionality.

so maybe i need some more opinions on whether toolbar symbols are really necessary or not. ;)

regarding the thin line (displayed underneath -or better- behind the volumebar)...
...i'd like to say that you are a very good observer. what loads first is the case.png and every other element would be drawn on top of it then. you are right, there's a different sized gap inside of that thin line which only can be recognized if you (re-)load the skin. well, since the volumebar would be displayed on that gap anyway, i haven't found it necessary to close that gap yet. but it doesn't really matter if there's a gap or not, so i'll fix that and in the next update the gap will be gone. ;)


@ all:

i'm glad you like the nocover images.
however i still would like to try some different ones.
maybe i'll post some various shots within the next days to give you an idea what's on my mind. :D

still to do:


hotspot button for the extended panel
mouseover effect for volumebar
perhaps a cool special effect
and the most challenging task of them all... cover transitions
tiny versions of all styles plus their according lyrics viewers



anyways...

...thank you soo much for your feedback!!
:D :D


....OtisBee

[Mike1959]

thanks 'Otis' for the tips on how to configure the lyric viewer...tried my best not to make the email sound like another fault finding exercise.
you've done what I was hoping you'd do and that was to present me and others alike with a solution.

thanks again.

Mike.

[extreme_mac]

thanks

[OtisBee]

thx!
;D

btw...
...the todo list is pretty much empty now.
currently i'm working on a smaller lyrics viewer version to match the tiny styles i've recently added to the skin:

http://i28.tinypic.com/24wx9uw.png

oh, and i've decided to use the very first toolbar style (without play/pause symbols) again.

also i've recognized that the mouseover effect for the progressbar can be pretty annoying when i jump between the main toolbar (prev, play/pause and next) and the ratings (or other elements above the progressbar), because whenever i cross that progressbar it lights up for a bit.
since i move around my mouse quite often inside of that mentioned area, i decided to switch off (delete) the mouseover effect for progressbar. ;D
the hand cursor (once the mouse has entered the progressbar area) would give a visual feedback anyway.


Premium Members: if you like you can send me a PM with your email address or you can contact me directly via email and i'll send you a copy of this skin.

for those who are already betatesting my skin, please be patient. i'll send you the recent update (with tiny skin styles) ASAP. ;)


thx!


....OtisBee

[Carlos]

...
@ Carlos:
...
oh...
...btw, there was a question (or maybe a request) by Operator who asked if it would be possible to display artist and/or title somewhere in the titlebar of the lyrics viewer. this might be something for you to answer, since this isn't really a design matter. :D
...


There's no plan to add song title/artist to lyrics viewer right now. I don't think it'll worth the extra settings and procedure just to draw it since CAD already displays it tho I agree it's a nice suggestion. :)

By the way, it's not possible do disable the special effect for a style. Right now the best solution is to create a single special effect for the tiny (and cool!) styles.

[Mike1959]

Hi 'Otis'...Loving the latest version...excellent indeed.
the 'tiny' version is a big fave for me...only slight amendment I needed to adjust was the 'time remaining tag' (%remaining%)
I just had to reduce the spacing in that particular line and resave....now it's excellent.

http://img246.imageshack.us/img246/638/scr1ds2.jpg

[OtisBee]

that's strange!

Operator has reported the exact same issue, but no matter how often i reload CAD or just this skin, no matter how often i even reboot, the textline4 always shows up the way it should. besides, i haven't changed a single setting after i have sent the skin.

that's odd. :-\


@ Carlos:

so you think an Effect folder with a blank effect0.png would do the trick?
okay, i'll try that. :D


thx again and again for all your feedback. ;)


....OtisBee

[Mike1959]

Hi Otis...

you can see the before/after screenshots from the time remaining tags...
the bottom one being the corrected one which gives me a correct display.

strange indeed how this should only effect the 2 of us.

http://img132.imageshack.us/img132/2563/scr2rn2.png

http://img132.imageshack.us/img132/5809/scr3zf4.png

[Carlos]

@ OitsBee

I mean another, a new effect for tiny styles.

Why not add the blink effect when the song is paused to tiny styles too?

[andy_rose]

Hi Otis...

you can see the before/after screenshots from the time remaining tags...
the bottom one being the corrected one which gives me a correct display.

strange indeed how this should only effect the 2 of us.

http://img132.imageshack.us/img132/2563/scr2rn2.png

http://img132.imageshack.us/img132/5809/scr3zf4.png



That happens to me also. Adjusting it according to the screenie fixed mine also:) Oh, I am running Vista 64 bit.
Everything else is smooth!

[Carlos]

Hi Otis...

you can see the before/after screenshots from the time remaining tags...
the bottom one being the corrected one which gives me a correct display.

strange indeed how this should only effect the 2 of us.

http://img132.imageshack.us/img132/2563/scr2rn2.png

http://img132.imageshack.us/img132/5809/scr3zf4.png


The thing is that different screen resolutions may cause the difference we've seen here.

The space between the two time tags is NOT in pixels (not precise) but just an empty space.

That's my bet. :)

Here 1280x1024 and I have the same issue.

[Mike1959]

yeah I run at 1680x1050 and I'm pretty sure 'Otis' runs even higher than that..
one you adjust it though and resave you don't have the problem again unless of course you
choose a different colour in the smaller styles he's created for 'ThaHUD' then you have to adjust manually for each.
not a huge problem I know but I'm sure 'Otis' must find it a little frustrating.

[Carlos]

yeah I run at 1680x1050 and I'm pretty sure 'Otis' runs even higher than that..
one you adjust it though and resave you don't have the problem again unless of course you
choose a different colour in the smaller styles he's created for 'ThaHUD' then you have to adjust manually for each.
not a huge problem I know but I'm sure 'Otis' must find it a little frustrating.


Don't forget CAD has a batch tool (see the "Menu" link at bottom left). ;)

[OtisBee]

....not a huge problem I know but I'm sure 'Otis' must find it a little frustrating....

oh yes indeed. :-\

my setting in skin editor looks exactly like in your screenshot (upper line).
i think i have to release 2 versions then (one for 1920x1200 and one for any resolution below that) just because of some spaces. :(

another solution might be to make some similar time display like in the bigger styles, but only using %remaining% tag then and maybe without the dark inset-like background.

but if i would do an additional special effect for all tiny styles then, i would have to do that for each tiny style, because i won't be able to use one special effect for all styles. in other words... a different skin texture (i.e. black steel) takes a different special effect. unless of course, i would let the %remaining% time tag be displayed on a background that would be the same in all tiny styles.

so, in resume it's a question of whether i'd like to go the long way (with a lot of work for 7 different tiny styles) or to go the short and somewhat convenient way (with one appearance to match all tiny styles).

i have to think about that.

so yes, i'm kinda frustrated.
so much trouble caused by so few spaces.

can't you all just switch to a 1920x1200 screen res?
c'mon, for once do me that favour!
;D

let's see what the wet fluffy bun in my head (which used to be my brain) has in store for us.
:-\


....OtisBee

[Mike1959]

Don't forget CAD has a batch tool (see the "Menu" link at bottom left). ;)


you know what Carlos...if I had a brain I'd be dangerous... ;D
so many options in CAD these days and I miss the easiest of all...thanks for the reminder...:)

[Carlos]

@ OtisBee

Or you could remove time tag from tiny for good.

It'll give a cleaner look since tiny has a smaller area after all.

Well, just a suggestion. :)




Don't forget CAD has a batch tool (see the "Menu" link at bottom left). ;)


you know what Carlos...if I had a brain I'd be dangerous... ;D
so many options in CAD these days and I miss the easiest of all...thanks for the reminder...:)


;D ;D

[Operator]

can't you all just switch to a 1920x1200 screen res?
c'mon, for once do me that favour!
;D


Sure, if you buy me a new monitor :P


Seriously: Why does this happen exactly? Is it because the width of the Skin Editor gets bigger with higher resolutions? If so, then the problem can maybe solved by using a fix width for it.

[Carlos]

By the way OtisBee what is you current DPI? A non standard/default DPI always causes trouble...

[OtisBee]

DPI?
...what's that?
DotsPerInch?
and how can i find out whether i use standard or not?

regarding your suggestion to have tiny styles without a time tag.
nope, i won't do that.

although you're right about the skin style having not much space to offer, i always need that remaining time info for my personal habits.

for example when i use winamp's autotag feature to look up an mp3 tag at gracenote and then apply it live to the currently playing track, i want to make sure that i won't run out of time for that action and then accidentially would tag the following song.

the same applies to a cover search.

i need the remaining time info.

besides it's one of the first things i edit in a newly downloaded skin. i change any timetag setting to show %remaining%.
if it's missing, i'll add it. :)

so...
...no OtisBee skins without a %remaining% time tag. ;D

[Operator]

OtisBee, if this problem can't be fixed the fast way, then you could make some kind of tutorial with pictures to show people what they need to do to fix the skin on their own. Would be much easier imho.


Regarding your DPI problem:

- Right click on your Desktop
- Choose "Eigenschaften"
- Click on the tab called "Einstellungen"
- Click on "Erweitert"
- You should find a field in which you can setup your DPI


By default, Windows XP uses 96 DPI.



I hope this was the correct way to reach this option because I haven't used XP for months and it's a little bit different with Vista.

[OtisBee]

ahaa..
..thx!

By default, Windows XP uses 96 DPI.

so, i have the default setting here.
:D

[Carlos]

Meanwhile I'll think in a pixel alternative... But not for a short term.

[Operator]

OtisBee, when can we expect a new update? I'm just curious, so never mind if it takes longer ;).

[OtisBee]

expect the final release for early next week.
;)

[jaz]

Wow ! Your new delight looks extremely smooth and very detailed ! 8)
Glad to hear it will be released soon ;D
Thank you for all your effort, hard work and that OtisBee touch of style ;)
It never fails...

[Operator]

expect the final release for early next week.
;)



You made my day ;D ;D ;D ;D

[OtisBee]

@ jaz:

your kindness is worth a fortune.
i think i don't have to mention that you made me blush again, do i?
:D


@ Operator:

;D ;D ;D