Shop Mobile More Submit  Join Login
×




Details

Submitted on
February 8, 2012
Image Size
179 KB
Resolution
950×548
Link
Thumb
Embed

Stats

Views
6,880
Favourites
50 (who?)
Comments
90
×
Espada - Firefox Theme Mockup by muckSponge Espada - Firefox Theme Mockup by muckSponge
A theme for the mainstream.

The most popular themes on AMO are dark, and I notice that a great number of you guys like the squared options in Stratiform. It probably has to do with some primal love of sharp, pointy dark objects that we have all had since we stepped out of that wet stuff we call the ocean (for those of you who agree with Darwin's theory of evolution).

So anyway, with all the time and effort I (and ~SoapyHamHocks, the co-dev of Stratiform, FoxE9, etc.) have put into our stuff, we only get less than a tenth of the user base of these popular themes. Hence I have come up with this mainstream, pleasant-for-everyone-that-doesn't-really-care-about-how-their-browser-looks-so-long-as-it-is-different-and-dark-and-has-pointy-edges theme.

Hence, it has a fitting name. Espada means "sword" in Spanish and is also the name of a model of Lamborghini, which are loud, obnoxious looking cars that everyone wants because they go fast and look cool.

So keeping in mind my goals, which are to:

:bulletblack: Appeal to as many users as possible
:bulletblack: Be dark, sharp and obnoxious to look at
:bulletblack: Keep the default interface mostly intact and just change the things that won't make it incompatible with major add-ons
:bulletblack: Be easy get used to and use

What do you think?

Update:

:bulletblack: Tweaked the gradients
:bulletblack: Made the text fields rounded and deeper looking
:bulletblack: Added gloss... EVERYWHERE
:bulletblack: More metallic looking icons
:bulletblack: Softer text shadows
:bulletblack: Tab bar now has a glow behind it

Another update:

:bulletblack: Old mockup got corrupted, started fresh
:bulletblack: All toolbars have 1px curved edges
:bulletblack: Tabs have bottom curves that curve away from the selected tab (similar to Safari)
:bulletblack: Inactive tabs are lighter in colour
:bulletblack: Selected tab curves at the bottom and has a stronger highlight
:bulletblack: Tab bar glow has been removed (mostly due to laziness)
:bulletblack: App menu button is styled like the inactive tabs to allow for a better hover and pressed state
:bulletblack: Nav bar is 1px shorter
:bulletblack: Text fields are 2px taller
:bulletblack: Text field icons have more spacing to replicate how it would have to look in the theme (even if it does look worse)
:bulletblack: More spacing between the toolbar icons to replicate how it would look in the theme
:bulletblack: Icons are now glossy
Add a Comment:
 
:iconplastikmaniac:
plastikmaniac Featured By Owner Aug 20, 2013  Student General Artist
":bulletblack: Be dark, sharp and obnoxious to look at"

...this is the Kanye West of Firefox themes?

Just kidding - it looks amazing. I can't wait till you finish it.
Reply
:iconmucksponge:
muckSponge Featured By Owner Aug 21, 2013  Hobbyist Interface Designer
Westy is nothing compared to Espada.
Reply
:iconwhitewraith:
WhiteWraith Featured By Owner Jul 28, 2013  Hobbyist General Artist
Exactly what I was looking for - Thanks.
Reply
:iconstaneck:
Staneck Featured By Owner Mar 28, 2013
I always loved this [link] - yours is pretty close :)
Reply
:iconhoangnhat1996:
hoangnhat1996 Featured By Owner Jun 11, 2012  Student Photographer
when will this be finished? i really love it! awesome job. :D
Reply
:iconmucksponge:
muckSponge Featured By Owner Jun 12, 2012  Hobbyist Interface Designer
When I have the time. I'm currently at uni (just had an exam today, yay), so I either spend my time working, thinking about working, or gaming hard :P

No time for hobbies :( Once the semester is over, I might have a bit of time to spare, but I'm still not sure what I'll do in it. So many things that require my attention :noes:

It IS something I want to finish, but I can't say it will happen any time soon, especially since I'm lazy and procrastinate and start new projects every 5 minutes.
Reply
:iconsonic4000:
SoNiC4000 Featured By Owner May 26, 2012  Hobbyist Interface Designer
Do want ^^
Reply
:iconplastikmaniac:
plastikmaniac Featured By Owner Apr 23, 2012  Student General Artist
I'd make a joke about "selling out" but I'm sure that's not a real concern of yours. :P
Reply
:iconmucksponge:
muckSponge Featured By Owner Apr 23, 2012  Hobbyist Interface Designer
Hahah, to sell out, I'd need to be profiting from it somehow :stare:
Reply
:iconrivenroth740:
RivenRoth740 Featured By Owner Apr 13, 2012  Student General Artist
well, whenit got finished, i'll use it.
nice wip theme!
Reply
:iconainq:
ainq Featured By Owner Mar 17, 2012
most teenagers i know want to look cool with glow and pointy edges and stuff.
Reply
:icondjdavid98:
DJDavid98 Featured By Owner Mar 11, 2012  Hobbyist Digital Artist
Y NO DOWNLOAD?
Reply
:iconmucksponge:
muckSponge Featured By Owner Mar 11, 2012  Hobbyist Interface Designer
It's just a mockup. I'm still workin' on it.
Reply
:icondjdavid98:
DJDavid98 Featured By Owner Mar 12, 2012  Hobbyist Digital Artist
OOOoooo... Liking it already :D You're the true master of Firefox Themes!
Reply
:iconmucksponge:
muckSponge Featured By Owner Mar 12, 2012  Hobbyist Interface Designer
Thanks :)
Reply
:iconihsgfx:
ihsgfx Featured By Owner Mar 5, 2012  Professional General Artist
Your work is always exceptional.
Reply
:iconmucksponge:
muckSponge Featured By Owner Mar 5, 2012  Hobbyist Interface Designer
Thanks :)
Reply
:iconcrixler:
Crixler Featured By Owner Mar 4, 2012  Hobbyist General Artist
Will these styles eventually be added to Stratiform, or will it be standalone? I'm really liking the tab styling, though I'm not a huge fan of dark themes.
Reply
:iconmucksponge:
muckSponge Featured By Owner Mar 4, 2012  Hobbyist Interface Designer
It's possible... Although I'd have some rather serious problems with the curved bottom sections to consider. I think I could do it in a similar way to how I do the selected tab colouring.
Reply
:iconxankazo:
xanKazo Featured By Owner Mar 4, 2012
You've given into the dark side of the force! :p
LOL, Nice theme!
Reply
:iconptukey:
ptukey Featured By Owner Mar 4, 2012  Hobbyist Artist
WOW Very Nice!!!!!

:wow:
Reply
:iconayucyruz:
ayucyruz Featured By Owner Mar 4, 2012
Newest update looks slick!
Reply
:iconrevengexx14:
revengexx14 Featured By Owner Mar 3, 2012  Student Digital Artist
Not bad, usually dark themes turn out over-the-top, but this looks really awesome.
Reply
:iconmucksponge:
muckSponge Featured By Owner Mar 3, 2012  Hobbyist Interface Designer
I think I've programmed myself to be incapable of doing anything over the top :P
Reply
:iconrevengexx14:
revengexx14 Featured By Owner Mar 4, 2012  Student Digital Artist
lol dA needs a +1 or Like button or something.
Reply
:iconmucksponge:
muckSponge Featured By Owner Mar 4, 2012  Hobbyist Interface Designer
I guess the dA equivalent is the fav button.
Reply
:iconajblue7:
ajblue7 Featured By Owner Feb 28, 2012
I'm confused how are dark themes obnoxious? Dark themes use less light to produce, resulting in less eye strain. Also, dark themes help the eyes focus on the content that they are viewing and not the browser. On a side note, i think sharp box-like UI help the experience to be a uniformed one. Where round UI usually results more processing for your brain to comprehend. Browsers are the gateway to the Internet and should be as hidden as possible, without limiting functionality.
Reply
:iconmucksponge:
muckSponge Featured By Owner Feb 29, 2012  Hobbyist Interface Designer
Think about it this way, which shape is harder for your brain to "comprehend", a circle or a square? The answer is not obvious. A circle is basically just a very rounded square. It is simpler, as it has less points. Now stretch that circle out by repeating the middle section and you get a rounded rectangle, which should be just as easy to comprehend.

By obnoxious I was refering to the somewhat "shouty" appearance of the theme. The default theme aims to blend in with the OS's default UI, while this theme aims to stand out and go against all of the UI guidelines (except the actual layout, which stays the same). I made an analogy with a Lamgorghini supercar, which is generally considered a very loud and obnoxious car. It has big, pointy edges, has a habit of attracting attention and has those looks that little boys like to stick on their wall.

The experience with a dark theme is in no way unified with anything but the theme itself. By definition, unification means to make something "become a single unit". No OS has a dark theme of this style by default, so it is not unified with the OS, and most web pages are not dark oriented, so it is not unified with the web. I agree that light on dark text is easier on the eyes, but in most cases it does not improve visibility, as there is usually more contrast in the upper ranges of the light spectrum available to monitors, as this is what the human eye is better at differentiating (most people don't have very good night vision), so dark details tend to go unnoticed, which means the details need to be lighter, so instead of light on dark, you end up getting light on darkish. Compare this to dark on light (like the default theme) and it actually has less constrast and therefore is harder to destinguish against the background. Basically, there is less room to play with when working with dark themes.
Reply
:iconbalderoine:
balderoine Featured By Owner Feb 23, 2012  Professional Interface Designer
Sharp and obnoxious lmao :D. It looks awesome but what do you think of a cosmic panda styled theme?
Reply
:iconmucksponge:
muckSponge Featured By Owner Feb 23, 2012  Hobbyist Interface Designer
Depends, would it be all dark, or all light, or a mixture? Because the YouTube UI can't really directly translate to a web browser's UI. It has some sections that are dark and some that are light. I prefer the dark bits.

I quite like the idea though. I think I'd use the dark side bar thingy as a tab style if I were to make it.
Reply
:iconplastikmaniac:
plastikmaniac Featured By Owner Feb 15, 2012  Student General Artist
It needs a curve... just... like... 1.5px or something...
Reply
:iconmucksponge:
muckSponge Featured By Owner Feb 15, 2012  Hobbyist Interface Designer
The problem is, adding a curve to the tabs ain't easy, as the complexity increases ten-fold when the tabs are curved and are sharing one side of one another (only one border between them). I may be able to cheat and give the tabs a tiny curve and have them overlap each other by 1px, creating what looks like a straight edge until the start and end tab. The curve would be 1px, however :noes:
Reply
:iconzedestructor:
ZeDestructor Featured By Owner Feb 14, 2012
I'd say its quite the opposite. People who love dark, pointy themes are the only ones who can be bothered to go look for new themes and as such skews the statistics in that direction.

One request though, can the inactive tabs be made transparent aero similar to the Australis theme?
Reply
:iconmucksponge:
muckSponge Featured By Owner Feb 14, 2012  Hobbyist Interface Designer
They could, but you may as well wait for Onyx by ~BoneyardBrew if you want that.
Reply
:iconnguyenbathung:
nguyenbathung Featured By Owner Feb 11, 2012
I used to love the curve, round border radius... I thought I'll never like the square style... BUT, Espada and Windows, Metro changed me...I am loving the new, modern square style from now...
Reply
:iconilifino:
ilifino Featured By Owner Feb 11, 2012  Hobbyist Interface Designer
Great contrast. :D :thumbsup:
Reply
:iconnguyenbathung:
nguyenbathung Featured By Owner Feb 11, 2012
nice,...look a little bit like Onyx from Boneyardbrew [link]
when it'll be out or will it come with Stratiform??? I think you should remove the location-bar and search-bar's favicons. The theme is black and white, so colorful favicons like google,... will not suit at all, favicons on tab is enough...I like those icons...but could you make it compatible with condition forward button and put on some styling for the back button (bigger, have a circle around it,... like the strata 50 style)
Reply
:iconmucksponge:
muckSponge Featured By Owner Feb 12, 2012  Hobbyist Interface Designer
I'm still thinking about hover and pressed states for the buttons. I'll just have to see what looks best.
Reply
:icongossiplife:
GossipLife Featured By Owner Feb 10, 2012
nice look
oooh spewboy, how i wish you can trun to Chrome :nirvana:
Reply
:iconmofabo:
mofabo Featured By Owner Feb 10, 2012
Why? You can't do anything with Chrome.
Reply
:iconiovaart:
Iovaart Featured By Owner Feb 10, 2012  Student Interface Designer
How about removing all favicons? would make it better and cleaner...
Reply
:iconmucksponge:
muckSponge Featured By Owner Feb 10, 2012  Hobbyist Interface Designer
As I said previously, it is a theme for the masses, and the masses would not be pleased.
Reply
:iconiovaart:
Iovaart Featured By Owner Feb 10, 2012  Student Interface Designer
I see...
Reply
:iconmucksponge:
muckSponge Featured By Owner Feb 11, 2012  Hobbyist Interface Designer
Try this in Stylish:

#identity-box #page-proxy-favicon,
.tabbrowser-tab .tab-icon-image,
#searchbar .searchbar-engine-image {
visibility: collapse !important;
}

The code was written on my MacBook without access to methods of testing, so hopefully it works.
Reply
:icon01vlatce:
01Vlatce Featured By Owner Feb 10, 2012  Student
Nice, clean, dark and cool. Perfect.
Reply
:icontataarujin:
tataarujin Featured By Owner Feb 10, 2012  Student General Artist
Make top left corner of the first tab and top right corner of the "Add tab" button 3px border radius. Is it possible?
Reply
:iconmucksponge:
muckSponge Featured By Owner Feb 10, 2012  Hobbyist Interface Designer
It is possible, but very difficult and there is no way to get tab groups to work with it.
Reply
:icontataarujin:
tataarujin Featured By Owner Feb 13, 2012  Student General Artist
Like somebody use tab groups...
Reply
:iconubbed:
UbbeD Featured By Owner Feb 10, 2012
love it, when do you plan to release the first?
Reply
:iconmucksponge:
muckSponge Featured By Owner Feb 10, 2012  Hobbyist Interface Designer
I'm working on the theme as we speak. Not sure when it will be ready because there is a lot more to do than what is displayed in the mockup.
Reply
Add a Comment: