User login

7.x

You are here

Popular Themes

7.x

Author:JurriaanRoelofs

Datum:10-1-'12

Drupal: 

New Year. New Prices.

I've just set new prices for all products in the store, that means including memberships!.

An overview of the price changes:

  • Normal theme: €65 to €49
  • Developer theme: €99 to €79
  • Standard Club: €399 to €299
  • Developer Club€499 to €349

You better act fast, before I change my mind. (just kidding)

Author:JurriaanRoelofs

Datum:30-12-'11

Respondr theme sneak preview

Working on the new Respondr theme, to be produced next week. It will be built on the awesome new Arctica+Tundra base themes.

New features that come with Respondr:

  • Flexslider with swipe support
  • Scroll to top link
  • Flawless device agnostic user experience
  • Tweet slider
  • Flickr widget

Not sure how I'll implement the flickr integration for the footer block. If there isn't a specialty module available I'll just use Feeds module.

Respondr theme Sneak Preview
.

Author:JurriaanRoelofs

Datum:20-12-'11

Arctica: The New Base Theme for Responsive Web site/Web app Design

Making Responsive Design Easy for You

Have you been hearing a lot of talk about responsive design and media queries, maybe even checked the http://mediaqueri.es/ website, but you’re unsure how to get started with this new technology? Then you’re not alone. Responsive design is a big change and while the surge of tablets and smartphones with broadband internet demands we make our websites work on small devices now, there is still a lot of figuring out to do.

Arctica takes the next step in facilitating responsive web design in Drupal. It works in the background, providing Drupal with a layout system via the Skinr module and its own CSS management system. But unlike other base themes it doesn’t stop there; The Arctica Configurator (aka theme settings form) provides an entirely new interface that reduces the complexity of responsive design by showing and telling what is happening in the background, when your website is elegantly adapting to and infinite number of screen sizes.

Also check the minisite: www.sooperthemes.com/arctica/

Arcitica Configurator screenshot (click for enlargement):

Other Responsive Themes

Before starting the 3-month code/test/code/test sprint it finally took, I thoroughly researched the currently available options, most notably adaptivetheme and omega. Here are some points that Arctica does different that I think are important:

  1. Provides a usable and flexible interface to the layout system, giving you a birds eye view of what your design is doing on different devices.
  2. Not making assumptions about how you want to implement responsive design. Media queries are not hardcoded in the theme, they exist in the configurator and you are encouraged to make your own. You are free to choose a mobile first design, a content first design or the less intimidating top-down design (desktop->mobile).
    Not every website needs the same approach, that’s why I also made the number of media queries flexible. Some websites might need as much as 7 media query contexts to work in all devices but many simple websites can easily do it with 2 or 3 media queries.
  3. Fixed-width gutters. Many flexible layout systems use flexible width gutters. Being a designer myself I found this a big issue. Design is all about ratios and rythm, and white-space is a fundamental part of the design. I developed my own layout system (long before working on Arctica) that supports flexible width with fixed gutters. This avoids the problem of having your vertical gutters shrink and expand inifintely to fit the viewport while your horiztonal gutters do not respond at al, thus breaking the foundation of your design.
  4. Performance: I’ve always been a into optimizing code and monitoring server performance. Arctica is probably not yet perfectly optimized but it has a very low performance impact considering the amount of “stuff” it does for you. I spent a whole day ab testing all the latest base themes and found that most base themes had an acceptable performance impact, adding a ~5% penalty compared to Stark. An exception was Omega which performed around 10% slower than Stark in both throughput and response time. Complex stand-alone themes such as Marinelli and Danland also incurred about a 10% performance penalty compared to Stark. Now remember that stark is a bare bones "theme" and while being fast it doesn't make your website responsive, or pretty.
  5. I added some new features such as built in polyfills and mobile browser tweaks, CSS3PIE integration, Arctica Visual Bootstrap, providing design defaults for common Drupal elements and turning off core stylesheets. All of this is optional of course you can turn it all off. I’m also using SASS/Compass in all my new base/sub themes but I’m not assuming everyones else wants to know about SASS so I make everything compatible with hacking regular CSS.
  6. What Arctica doesn’t / shouldn’t do is also something I thought about. Some things are better left for modules to do. For instance text strings are content, not theming, so I didn’t add a 100 theme options to change node links and comments links etc. You can use the stringoverrides module for that.

Arctica in the Wild

Allthough Arctica is brand new and just at the beginning of a long road of active development, there are some themes that demonstrate its features:

You can download Arcitca now

http://drupal.org/project/arctica

Testers Wanted

I would love to hear your opinion and ideas, feel free to comment or tweet @sooperthemes or @jurriaanroelofs with #arctica.

The easiest way to learn Arctica

The easiest way to try the themes is by installing the StarterKits (installation profiles) that install a demo site with demo content, including production-ready responsive design configurations. You can try the free arti theme but you'll have an even better resource if you buy the new Deviant premium theme or Hellofolio premium theme. Both come with a StarterKit. They come with responsive blocks, views and images. If you've been on the fence about buying premium themes, I've just now started a 50% discount promotion on SooperThemes.com to celebrate the introduction of the new theme. This is the first time in 2.5 years of business that the premium Drupal 7 themes are on sale.

Author:JurriaanRoelofs

Datum:9-11-'11

Dropping IE6 support for next generation of themes

Just posting it here as a heads up, the next generation of themes will not support IE6. Time to say goodbye to this legacy browser. _goodbye: ie6;

In the future IE6 will get a simplified version of the website, or maybe even a print stylesheet.

Author:JurriaanRoelofs

Datum:20-1-'11

Tundra Beta2, on to 1.0

Yesterday I posted the beta2 version of the free Tundra framework theme. With lots of bugfixes I hope this means we can almost get to 1.0. See project page for downloads and update instructions:

http://drupal.org/project/tundra

Beau

To communicate prestige & quality choose the elegant, beautiful Beau

Purchase Single License &eur;
Join Standard Club
Beau Premium Drupal Theme
View Demo Site

Beau Design Concept

Beau was designed to communicate elegance, quality, beauty and prestige. The layout is simple but with much attention to detail and very classy color schemes.

Who should use Beau?

Beau is most suitable for formal organizations such as law firms, accountant firms, up-market restaurants etc. Play with color schemes to get different warmer look.

Standard Sooper Features. Setting the standard for superb quality

SlideshowKit

Sooper SlideshowKit

Featuring your content in a slick looking slideshow has never been easier! Sooper SlideshowKit helps you build a slideshow configure it just the way you want. With Sooper StarterKit or with our documentation your slideshow is up in minutes!

DropdownKit

Sooper DropdownKit

Powered by our own SooperFish jQuery plugin, the DropdownKit offers multi-level animated menus, fully integrated with Drupals’ menu system. Everything about the menus can be finetuned with advanced configuration options!

Skinr

Sooper Skinr Integration

Make blocks stand out with the Skinr module! The Skinr integration offers eye-catching callout-skins as well as per-block control over typography and color. You can Skinr skins for point and click grid design.

LayoutKit

Sooper LayoutKit

All theme by SooperThemes can be configured to have any fixed OR flexible layout width. The grid system fully supports flexible layouts and thanks to some CSS sourcery it will all work perfectly in older, less gifted browsers (ie6).

FontKit

Sooper FontKit

he Sooper FontKit gives you choice out of 25+ awesome extra fonts. You can also easily add your own fonts using the Cufon website and just putting it in a folder in the theme.

ColorPicker

Sooper ColorPicker beau

We offer tailored designs by integrating all themes with Drupals’ color module. Create your color scheme in seconds with the Sooper Configurator, press save and watch how CSS and images are recolored to give birth to your unique design!

Sooper StarterKit

Create a website in less than 5 minutes! When you install the Sooper StarterKit you get the same content as on the demo site. This means you can just edit the blocks, nodes and menus, remove stuff you don't need, and finish your project much faster than ever before!

Sooper StarterKit

Sooper Configurator

You get to make your theme tailored to fit your needs with our embedded configurator. The configurator allows you to customize Colors, Layout Settings, Fonts, Drop-down menus and more.

Sooper ConfiguratorSooper ConfiguratorSooper ConfiguratorSooper ConfiguratorSooper Configurator

Project Politika for Ubercart pt. 6: Discuss Modules and Features

After voting on the design Style and purpose of the Politika free Drupal theme it's time to discuss modules and features.

What modules do you use on your Ubercart sites that benefit from custom theming and what modules do you think have the future. Post a comment if you got experience here!

You can also suggest modules that do not relate directly to ubercart but keep in mind that we decided do build an ecommerce theme so the module should be useful for a webshop.

For inspiration you can check out the cool module styling (book module, forms, skinr) on Synopsis and the other premium Drupal themes by SooperThemes.

Schedule for june

  1. June 7th (mon): Present and discuss project
  2. June 9th (wed): Discuss Theme purpose (type of website)
  3. June 14th (mon): Poll for theme purpose
  4. June 16th (wed): Discuss design style
  5. July 8th (thu): Poll for design style
  6. Aug 17th (tue): Discuss modules and features
  7. Aug 21st (sat): Questionnaire about modules and features
  8. Aug 25th (wed): Summary of poll and questionnaire results

This part is where your comments really count because I'm not sure what contrib modules and plugins are popular on webshops, other than Ubercart, wich is also what powers the theme sales on sooperthemes.com. Share your experience to help create an awesome GPL theme!

p.s. I also know there are alternatives to Ubercart but since ubercart is the most popular let's not get into that discussion.

Project Politika Drupal Theme pt. 4: Discussing Design Style

In the recently completed Poll on the purpose of the Politika theme we have established that it will be an ecommerce theme!

This is exciting as well as challenging. E-commerce site really need a design that is focused on the content and focused on selling. Good Ubercart themes should also have some nice icons to skin the stock imagery.

I do not often build ecommerce sites but I do have experience in this and I also have a Msc in marketing (pending my thesis) so this project will be a nice combination of my web and uni educations.

Now it's time to discuss the style of this design. I want to build a theme that you all are dying to use on your next project so I would like to hear what kind of design styles are in demand in the community.

Luckily for us, a major webdesign blog has recently posted an overview of big ecommerce website designs where you can get inspiration: http://www.noupe.com/inspiration/showcase-of-big-online-stores.html

Tell me what designs you like! Post comments and I will create another poll so that you can vote on the design style

Since this is an ecommerce site there is also one very important dimension on which we have to choose a position, which is the up-market versus down-market dimension. If you sell luxury products you will want an up-market design like for example http://www.vogue.co.uk. If you sell cheap offers you will want to appear like you offer the best deals and approach a more down-market design style like for example this: http://www.mediamarkt.de/

If you have built a beautiful ecommerce site with Drupal in the past, feel free to post that too!

The discussion will run until June 21st which is next monday; unless the discussion clearly needs some more time, then it will be extended.

Also take a look at the latest Sooper Drupal Themes, Synopsis and Syan. These design styles could also work well for a store.

Schedule:

Schedule for june

  1. June 7th (mon): Present and discuss project
  2. June 9th (wed): Discuss Theme purpose (type of website)
  3. June 14th (mon): Poll for theme purpose
  4. June 16th (wed): Discuss design style
  5. June 21th (mon): Poll for design style
  6. June 23th (wed): Discuss modules and features
  7. June 28th (mon): Questionnaire about modules and features
  8. June 30th (mon): Summary of poll and questionnaire results

Project Politika: Purpose of the Theme (website type)

Politika is an effort to make an amazing looking and rich-featured theme for Drupal 7 and 6. For more info check the first project politika blog post!.

As a first step to conceptualize this Drupal theme I would like some input about what types of websites you are building (yes you too) and what kinds of websites are difficult to visualize with the current offering of themes.

Here are some that I can think of:

  • Information intensive websites that require big grid-like layouts, i.e. portal websites and news websites
  • Photo websites, websites about photography and/or photographers, or portoflio websites for photographers or other artists
  • Micro blogs (like tumblr)

That's all I can think of, just post a comment what sort of websites you build with Drupal, or would like to build with Drupal! Just post a comment, it only takes a second!

All responses to this post will be put into a poll next monday, as per the Politika schedule:

Schedule for june

  1. June 7th (mon): Present and discuss project
  2. June 9th (wed): Discuss Theme purpose (type of website)
  3. June 14th (mon): Poll for theme purpose
  4. June 16th (wed): Discuss design style
  5. June 21th (mon): Poll for design style
  6. June 23th (wed): Discuss modules and features
  7. June 28th (mon): Questionnaire about modules and features
  8. June 30th (mon): Summary of poll and questionnaire results

Also check that you don't choose something that is already covered by my previous (though not free) drupal themes because I want to build something rather unique and more in-the-moment with this project.

Thanks for your input.

Project Politika, Help Design a Free GPL Drupal Theme

Politika is an effort to make an amazing looking and rich-featured theme for Drupal 7 and 6. It will be designed for the community, and in part by the community… though it will not be designed by democracy; to maintain a coherent and high quality design that adheres to web and accessibility standards we will have to be a republic. But the good type of republic, that listens to the people!

Division of project:

SooperThemes:

  1. Art Direction
  2. Graphic/UX design
  3. Drupal theming
  4. Documentation

Community:

  1. Type of website for which this theme will be designed (blog /portal/ media/ multimedia/etc..)
  2. General directions for the style, atmosphere and design stream (e.g. minimal/clean vs web2.0 vs glossy)
  3. Recommendations of modules and content types to be supported and designed

Guesstimated timeline:

June/July 2010: Collecting information

July 2010: Being on vacation resisting the urge to make design mock-ups

August 2010: Providing some design mock-ups for the community to choose from

September-??? 2010: Production. The theme will be full featured like the premium themes and these usually take around 8-10 weeks to go through the design/development/testing/QA loops before they are ready for release.

Schedule for june

  1. June 7th (mon): Present and discuss project
  2. June 9th (wed): Discuss Theme purpose (type of website)
  3. June 14th (mon): Poll for theme purpose
  4. June 16th (wed): Discuss design style
  5. June 21th (mon): Poll for design style
  6. June 23th (wed): Discuss modules and features
  7. June 28th (mon): Questionnaire about modules and features
  8. June 30th (mon): Summary of poll and questionnaire results

What can you do now?

I will post a poll about the type of website that we want to design a theme for next Wednesday the 9th of june.

Start getting some inspiration from sites like http://buytaert.net/tag/drupal-sites and http://drupal.org/forum/25 and http://www.designfridge.co.uk/ and http://www.1stwebdesigner.com/ and http://www.smashingmagazine.com/ or wherever you like to get inspired so that you can contribute to the polls and discussions that I will post to get the an idea of what the community wants :). It is always nice if you can make reference to websites or case studies (ie from Drupal.org) if you post comments with ideas.

I think the best way to discuss and decide about the design process is something like this:

  1. Have a discussion about a step in the design process
  2. I analyze the comments and try to summarize them into a poll, and then in the poll the majority decides.

This project depends on your input, so do not hesitate to comment or email. I will manage the project on this blog, on facebook/twitter and via the Drupal.org project page but most communications for development will take place on this blog, using the politika tag. The easiest way to follow the project is the subscribe to the global RSS feed which combines sooperthemes.com content with twitter. If you dont use an RSS reader but you do use facebook, the SooperThemes facebook page is connected to this RSS feed!

What can you expect?

I will make this free theme at least as good as the premium themes and if people come up with cool ideas I have no problem making custom features or jquery plugins to make it work. Expect this for sure:

  • GPL license for Design, Theme, CSS and whatever javascript code is made for this theme and hopefully the theme can go fully on Drupal.org. (depends on whether non-GPL font/libraries or icons are needed)
  • Cross browser compatibility
  • Fixed and flexible width configuration, separate left/right sidebar width control
  • SooperFish dropdown menus
  • Sooper FontKit integration with hopefully a perfect-fitting free font
  • Skinr integration with some distuingished block styles and with grid controls
  • Full Color module integration! Including support for image re-coloring
  • Sooper Starterkit (a Drupal install profile with database to load demo content)
  • Design & Theming for book module, comments, webform module, Poll module, user profiles, taxonomy, twitter module

Pages

Subscribe to RSS - 7.x