About the new skin

By Jon Hickshicksdesign. Wednesday, June 3, 2009 6:47:23 AM

, , , , , , , ,

Initially, a new skin wasn't planned for Opera 10. We were just going to do a 'clean-up' of some elements and focus on UI for new features. However, over time, the new UI elements started jarring with the 9.5 skin, and steadily everything started getting updated. In particular, there were a lot of icons that were just plain fuzzy - they weren't following pixel lines well and the anti-aliasing made them blurry. Almost all the icons have been replaced, and by the time the final release is out they'll all be revised. sherlock


Elements of the skin remain however, for example the color scheme is very much taken from it, but with lines being simplified, and the use of etch effects and border inner highlights to give extra crispness to edges.

Things to bear in mind while you're playing with beta 1:

  • What you see here is neither complete nor final, and there will be more iterations before the final release. Some elements will still look like the current skin!
  • Currently the skin is implemented for the default setup, tabs at the top, panels on the left, panel toolbar on the left and status bar at the bottom. Other setups will look a bit odd - for now.
  • This build doesn't include the new features in Opera 10, so one of the reasons for the revised skin isn't there. All we be clear when the beta comes out!

Give it time to 'settle down' and see what you think!

For the skin designers out there, there is a new parameter for Text Shadow. This was added to reproduce the etched text effect that is standard on OS X, but many windows apps are starting to use this style too. Here's how it works:

Text Shadow     = 0 1
Text Shadow Color    = #ffffff

The first parameter has the X and Y co-ordinates of the shadow. The example shows a 1px shadow directly underneath, but you can also use negative values. The second is self-explanatory! Blur-radius hasn't been enabled as this causes too much of a performance hit. Have fun with this!

Another new skin feature is the ability to skin the horizontal and vertical splitters. The element names are:

[Splitter Horizontal Divider Skin]
[Splitter Vertical Divider Skin]

These are set at 3px, but take skin parameters just like other elements.

Keeping digital memories aliveTurbo Experience

Comments

Aleksander AasAleksander Wednesday, June 3, 2009 6:47:54 AM

Am I the only one getting excited?

FavDjiXas Wednesday, June 3, 2009 7:11:26 AM

This build doesn't include the new features in Opera 10



Are you talking about the one which was released previous week or the one which was leaked/released yesterday?

Tamil Wednesday, June 3, 2009 7:17:55 AM

up

NicoHellbillyDeluxe Wednesday, June 3, 2009 7:50:44 AM

@ DjiXas:

He's talking about last week's snapshot.

Copy & Paste is bad ;P

Aleksander AasAleksander Wednesday, June 3, 2009 9:10:57 AM

Originally posted by DjiXas:

Are you talking about the one which was released previous week or the one which was leaked/released yesterday?


The one from yesterday is Opera 10 Beta 1. Both have the same build number "1551"

Zotlan Wednesday, June 3, 2009 11:14:21 AM

Could you tell us why the toolbars are taking up more and more room? It's very inefficient and bad for users with small screens.

Perhaps it's time to include a netbook/notebook version of the skin?

mrmass Wednesday, June 3, 2009 1:21:24 PM

It'd be sweet if I will be able to move the tabs bar to the left (in place of the panels) and still have thumbnails visible. With the current version, things just look weird.

nashnash_zarim Wednesday, June 3, 2009 2:07:36 PM

love the new skin. <3

Charles SchlossChas4 Wednesday, June 3, 2009 2:26:42 PM

up

yeeliberto Wednesday, June 3, 2009 2:29:01 PM

It looks way better than the default one.

Juan Arturo Andrade Mendozamontcha670629 Wednesday, June 3, 2009 5:59:06 PM

impresive!

_Grey_ Wednesday, June 3, 2009 6:24:44 PM

It's still too colourless. Shapes aren't really easy to remember and spot without colour (I'm talking about icons/images). The skin is a definite improvement over the 9.5 one, but I'm staying with the 9.2 (classic) skin.

edit: One suggestion. I like the preference dialogue. How about mirroring its design to the tab bar? I.e. unused tabs in blackish, background blueish?

lamarca lamarca Wednesday, June 3, 2009 9:11:34 PM

i liked the new skin indeed.

sevenred Wednesday, June 3, 2009 10:13:46 PM

I think the new skin looks quite good! The only thing I'd loose is the top bar (File, Edit, View, Bookmarks) and add its buttons somewhere else smart.

Also, I've had some trouble using the scroll bar on my laptop. It's actually hard to see because of the lack of contrast. Sometimes I even have to look over the scroll bar to find the slider.
It's a bit annoying to be honest...

incassociates Thursday, June 4, 2009 8:06:59 AM

Originally posted by Zotlan:

Perhaps it's time to include a netbook/notebook version of the skin?


Try opera_mini_skin-3 - best I've found so far for my netbook. Almost convinced me to not use Chrome :-)
Graham

Aux Thursday, June 4, 2009 8:59:11 AM

New skin in beta is EPIC FAIL! Sorry, but it simply suck. It takes more space then 9.5 skin and all the gradients... Looks childish. I'm VERY dissappointed.

Phaniphanikumarseelam Thursday, June 4, 2009 12:02:16 PM

I think the new skin is quite good and it has a lot of potential. I have a few suggestions and it would be great if those could be incorporated.
1. Like many people suggested, it would be great if we could have the tab previews on the left . The present location at the top takes up a lot of space.
2. It would be great if you could implement something like this : The tab previews would be hidden by default, but when we hover the mouse over to the tab bar, they slide out and become visible and then slide back in once we move the mouse away. That would be awesome bigsmile
3. When we open a lot of tabs (probably more than 10), the tabs as well as tab previews become almost useless. It would be great if we could implement something like a scrollbar, where after we open a few tabs (10 for example), the tab size and the tab preview size remains the same and then we have a scroll button which we can use to navigate between the visible and invisible tabs (somewhat similar to what Firefox does I guess).
4. Also, its still a bit difficult to distinguish between the active tab and the inactive tab. The difference is not that high, although it is much better than the old skin in 9.5. I think it could be improved a bit.
5. The title bar takes up a lot of space and is not very useful. The "minimize", "maximise", "Close" buttons could probably be moved to the Menu bar and then the title bar could be removed.

That's all for now i guess smile

Klascapitanswe Thursday, June 4, 2009 1:07:59 PM

Am I the only one who doesn't like the new look? The gradient on the none selected tabs doesn't look right at all. The OnMouseOver effect makes the x disappear. Why remove the colors from home and reload? What was bad with the panels icon from 9.6 and the bin as well?

Nick Morganmorganick Thursday, June 4, 2009 2:50:40 PM

Hey guys,

I like how you guys are continuing to push the browser UI, testing new ideas and conventions; always admired you for that.

After reading some of the posts before, I'd like to give a couple thoughts on the vertical tab idea. I'm not particularly in favor of this. More and more screens these days are at a 16:9 ratio; which would mean that if you did vertical tabs your tabs would vertically scroll after much fewer opened tabs.

I realize that people with smaller screens, like netbooks, would complain about this vertical space disappearing; however, its customizable and if you don't have enough screen real estate then don't use the preview tabs.

If you find them useful enough, then the screen real estate is less of an issue. Vertical tabbing is not going to solve this for you.

Is the UI in the sweet spot yet, no but its getting there.

Here are my two comments:

1. Is it possible we can get rid of the aqua themed buttons and progress bar for us Mac users. It just looks so out of place now. Almost makes me feel like I am using a much older app.

2. I would love to give more feedback on the UI but sadly this was the only place I could find to send it. Is there a more general feedback form for Opera? As a fellow UI person, I enjoy giving feedback to software I enjoy and use.

BohwaZbohwaz Thursday, June 4, 2009 3:05:37 PM

Lot of round corners, it sucks. How can I get the 9.5 skin back?

Phaniphanikumarseelam Thursday, June 4, 2009 3:14:36 PM

Some more observations:
1. I like the new panels icon, but the wand icon and trash icon dont seem too good. Is the Wand going to be called Key or something from now on? And I was initially confused about the purpose of the new Trash Icon. worried I think new users would be even more confused with what that icon is supposed to mean.

2. The bookmarks image seems out of place. I think you can find something better than a hearts for that. p

3. Also, when using visual tabs, i think it would be better to have the cross for closing the tab, at the top right rather than the bottom right. But its no big issue though.

I like the overall look of the new skin though. its very beautiful. It just needs a few tweaks here and there. For people who dont like it, just give it a little time to settle. I hated the skin for 9.5 initially, but learnt to tolerate it. smile

Hillairesthillairest Thursday, June 4, 2009 3:46:21 PM

Hi! it's really nice and fun, i like it! Apple mixed with Chrome (tabs) inspiration?

Aleksander AasAleksander Thursday, June 4, 2009 3:46:26 PM

@morganick all feedback will be pushed to the right people smile

Zotlan Thursday, June 4, 2009 5:03:58 PM

Originally posted by phanikumarseelam:

2. The bookmarks image seems out of place. I think you can find something better than a hearts for that.


Agreed, the heart just looks silly.

Originally posted by phanikumarseelam:

1. I like the new panels icon, but the wand icon and trash icon dont seem too good. Is the Wand going to be called Key or something from now on? And I was initially confused about the purpose of the new Trash Icon. :worried: I think new users would be even more confused with what that icon is supposed to mean.


The trash icon is confusing yes. But i think that, especially for new users, the key icon is much clearer than the wand. A lot of them won't even know that the password manager is called wand and the association between passwords and wands is not an obvious one. Passwords and keys though? Keys open things, you want to open a site... the link is pretty clear. The feature might ave to be rebranded though.

Originally posted by morganick:

I realize that people with smaller screens, like netbooks, would complain about this vertical space disappearing; however, its customizable and if you don't have enough screen real estate then don't use the preview tabs.


It's not just the preview tabs thing, most of the toolbars are simply thicker than they need to be (status bar has improved massively though). Sure we can mod that. But so can the people with the huge displays.

Opera-Browser-Fan Friday, June 5, 2009 7:20:38 AM

Hi, I'm too looking forward to new Opera 10, and I'm anxious to see all its new features in its final stage. I thank Opera developers for their hard work and excellent reults, but I also want to make a cople of concerns:

SKIN:

I still prefer these two great skins:

1. Opera Classic:
http://my.opera.com/mitchman2/skins/get.pl?id=8085

2. IE 7:
http://my.opera.com/crazybaseball11/skins/get.pl?id=6450

These two skins look cute and clear, and I am surprisd why the Opera Classic skin was removed. I think both the Clasic and IE 7 shoud be as an option in new Opera 10.




TAB MANAGER:

I was looking for showcase in Opera, and I hope the new Tab manager ill e no worse. I hope its preview engie will update the tab thumbs regularly as web pages are loading in. There hould certainly be a customizable hotkey for tiling\untiling.


Thanks again for the great software, Opera browser, the best browser in the world.

Thecthec16 Friday, June 5, 2009 8:15:29 AM

please include the visual tab on the left or right also .

thanks

NicoHellbillyDeluxe Friday, June 5, 2009 8:25:03 AM

@ All:

Please, no more requests about visual tabs on the left or right side.

It has already been mentioned by Jon Hicks that the skin is incomplte:

"Currently the skin is implemented for the default setup, tabs at the top, panels on the left, panel toolbar on the left and status bar at the bottom. Other setups will look a bit odd - for now."


So just be patient for now wink.

walterbugscout Saturday, June 6, 2009 1:42:10 PM

yes

skye11 Sunday, June 7, 2009 6:05:46 PM

Originally posted by chooseopera:

Elements of the skin remain however, for example the color scheme is very much taken from it


thanks for clarifying, since I was expecting different icons & more colors in your design
not bad so far, in keeping with the previous design - very conservative, often less is best
still, I'd prefer more (some) color & more contrast
awaiting your next edition...

Markymarkrich Sunday, June 7, 2009 7:11:47 PM

I'm not satisfied the new OSX theme merges well with the rest of the OS. Opera still seems to 'stand out' with a different look and feel.

Sit Opera alongside other OSX apps and the new Opera look still seems wrong.

What's with this new black bar behind the tabs? That's not OSX friendly design. Tabs seems too rounded and the icons stand out instead of blending.

It still remains my browser of choice but it still seems alien and foreign to the rest of the OS. Don't Apple have a section in their developers tools for design to prevent this type of problem?

Marky

MamiyaOtaru Friday, June 12, 2009 2:11:36 PM

splitters:

"These are set at 3px"

Could we finally have that changed? It's great that they can actually display elements now, but I'd love to be able to mess with the width

sevenred Tuesday, June 16, 2009 11:16:25 AM

I like the new skin. I've been using it for a while now, and the only things that looks out of place is the two top bars (File edit view bar, and the bar over that). Do like chrome did, remove them. smile

Otakar ThonOtiss53 Wednesday, June 17, 2009 7:44:34 PM

bad connection speed nacitani, poor quality pictures, you can not log, passvort!

Write a comment

New comments have been disabled for this post.