rad!ance

Homepage and Weblog of Fleur Jeanquartier

radi_owl_painting

November 16, 2011
by Fleur
0 comments

When I am searching for a solution to a common design problem…

Pattern.
…Design Pattern,
…Interaction Pattern,
…Interface Pattern?
…User Interface Pattern?
…User Interface Design Pattern Libraries!

Don't make me think
Software developers know Design Patterns as solutions to certain software design problems.

By the way, originally the idea of a pattern language was coined by the Austrian architect C. Alexander and was later being adopted by the software community.

Meanwhile, UI-Designer may know User Interface Patterns, which play an important role when they are designing user interface for software such as web apps.
Such patterns helps learning about design standards and guidelines, follow some of them, enhance and extend; or if you just need some inspiration have a look!
Goal is to create web-design that is not only technically fully functioning but also appealing to its users!

Below I would like to share some resource links to websites about UI patterns:

Be also aware of differences in UI design patterns when creating user interfaces for mobile instead of traditional web.
Though most of the mobile UI development frameworks (like Query, Senacha etc.) already make use or respectively consider most of the important UI design patterns, it is still essential to have a look on the several UI design patterns for mobile UIs:

This should be an inspirational collection but not a complete one. There are also several specialized design patterns for special accessibility issues, learnability issues, cooperation software, data visualization, interaction in games etc.

radi_owl_painting

September 26, 2011
by Fleur
0 comments

COMPASS : Navigating Your CSS

A nice thing to mention when working with CSS styles is COMPASS, the open-source CSS Authoring Framework.
You can use nested CSS rules, variables, selector inheritance use additional imports of common styles, clean up your style-rules and many more with this CSS framework.
SASS is compiled on the server by rubygems. There are also alternative dynamic css languages that are compiled on the client-side with javascript; see therefore the References list below.

To try it out you only have to follow a few steps:

  1. Download & Install RUBY (need for windows; on current osx its already installed)
  2. Getting compass & setting up environment on Windows:
    [prompt:] gem update --system
    [prompt:] gem install compass
    Or alternatively for Linux:
    [prompt:] sudo gem install compass

    (Note: Windows may require a console openend as administrator!)
  3. Setting up project:
    [prompt:] compass create
    [prompt:] compass watch
  4. Edit the *.scss files in the sass folder with any text-editor.
    If you used compass watch before the SCSS-files will be compiled automatically into CSS.
    Alternaticely just use:
    [prompt:] compass compile sass
    Good luck & have fun!
  5. Additions to compass: The CSS Parser:
    [prompt:] gem install css_parser
    (Compare Rubygems on CSS_Parser)
  6. References:
radi_owl_sporty

August 29, 2011
by Fleur
0 comments

Two-Days-MTB-Tour Tip

Last week we have been mountainbiking in the Austrian “Zillertal“.

We also took the chance to take a two-days-tour through the alps, namely starting from Finkenburg and riding to Italy and backwards, riding at least 110km and 4200hm. For planning this tour we used the information given on: http://www.bike-magazin.de/?p=875

Further pictures can be found in my facebook’s “Brenner Trails, August 2011″ album.

February 1, 2011
by Fleur
1 Comment

Notes on Drupal 7 & jQuery

next to other things such as experiencing with visualizations I’m currently working to port a Drupal6 CMS module to Drupal7 (the version 7.0 was finally released on January, 6th 2011) and while I was developing some strange Javascript happenings occured.
If you would like to develop for Drupal 7 and make use of JavaScript/jQuery the following things could save you some time:

Because of the fact that jQuery and many extensions are now a direct part of the Drupal Core, in most cases the following line won’t work:
$(document).ready(function() {...}

But you can use the following snippet instead:
(function($) {...})(jQuery);

So just put a wrapper around;
Let me give you a full example:

  (function($) { // this line is necessary for drupal 7
      // the line above instead of $(document).ready(function() {...}

    $("#oldContent").hide( 'slow'); // hide container

    $('html,body').animate({ scrollTop:
       $("#myContent").offset().top },
       { duration: 'slow', easing: 'swing'}
    ); //example for scrolling to a container

    //put your code in here

  })(jQuery); // this line is necessary for drupal 7

January 15, 2011
by Fleur
0 comments

Sunny January

On saturday we have been roadbiking because there wheather was really fine – in January! It was really great. :)

Therefore I use this chance and post some pictures of my roadbike I bought last year:

 

 

And on sunday we have been mountainbiking :) :