Posted on March 5, 2009 with 7 Comments
What is Balsamiq Mockups ?
Balsamiq Mockups is a solution for the real headache that each designers faces. It all starts when the client rejects the PSD mockup you have made with loads of effort and valuable time. Balsamiq mockups is a cross platform app which will help you to build rough sketch of the interface design project in a matter of time..
The Interface
One of the best part of the Balsamiq Mockups is its interface layout. It has a very easy, simple and usable Interface layout. Which will help its users to arrange elements by dragging it from the showcase to the workspace. Its interface elements collection can be accessed through a scrollable showcase and can be sorted using certain credentials.
Tags: AIR, App, Capsules, Design, Free, GUI, guide, interface, review, tools, UI, Web
Category: Toolbox
Posted on February 22, 2009 with No Comments
For this week we have selected virb regarding its wonderful relaunch with a bunch of new features and a brand new design. Since this is a new feather in our pot, we would love to hear from you. Keep sending your suggestions to us and we will be more than happy to feature your site.
Posted on February 2, 2009 with No Comments
We have almost completed the coding of the WordPress theme we where making. Now its time to make it a bit more visually appealing. As I have shown you in the first post of this series, We are making a minimal theme without many images.. So CSS is the star here.
This is how our theme going to be after Styling.
Tags: CSS, Design, Download, fee, Free, Freebie, HTML, Template, theme, tools, Tutorial, wordpress, wp
Category: Tutorials
Posted on November 2, 2008 with 2 Comments
In the second lesson of my WordPress theme for n00b’s series you will learn about Templates and Template files, the building block of a WordPress theme. Make sure that yo have understood the lesson one made some days before, else you will not understand any words that we use here.
In this lesson you are going to study about the template, template files and structure in the construction of a WordPress theme.
A WordPress theme is made of many templates and template files. As I have mentioned before, It is very easy to solve a problem if we split it into some related modules. The WordPress theme we are going to build will be in modular form, that means each and every element of our template will be splited into some separate modules.
We have the freedom to split or manipulate anything, everything in the WordPress theme keeping the syntax. But we have to think before making modules. Modules will be very helpful if we are going to make a complex theme. However we are practicing the modular method.
See the diagram below to get a knowledge about the modules I was talking about.
In the above image the green portion is the index.php file which will act as the parent template in our theme. Each requests comes to the homepage of the blog will be taken along with the index.php template file of our theme.
And the blue portions inside the index.php are the modules we make, they are also some templates files made with a purpose in mind.
Take the condition of footer as example, usually we add Stats Tracker’s codes in the footer of the website, if footer, header, sidebar and entry sections are together inside a single file called index.php it will be very hard to edit, tweak, update, or manage the templates. There is the ‘module’ comes as the angel 
. Here we create separate files for each elements, Footer section as footer.php, sidebar in sidebar.php header in header.php and blog section as blog.php and we call all of them into the index.php accordingly. So index.php will be clean, and all template files will become less lines of codes for easy management.
Well, now take a look at the mockup of each template files we used in the above image separately.
Header Template File
Here we add codes to render the Title, Description, may be Vertical Navigation in most cases (Depends on the layout and the designer) and meta tags for Feed URL, CSS URLS, etc etc…
Sidebar Template File
This template file includes the codes for the archive listing, blog rolls, and any other things a designer wants to add. In our theme we have a single column sidebar on the right side.
Blog Template File
Here we will include the entry, blog meta informations like Comment count, author, post date etc..
Footer Template File
Like header.php footer also stands same all around the theme in most cases. In the footer we include copyright information, Design link, and may be a link to the WordPress ! Also try to add tracking codes like Google Analytics etc to the footer.php if you use them, if something goes wrong with the service providers our site will not take too much time to load the important parts like content area and header.
If you missed any erilier posts, take a look at this unified url of the complete tutorial series. Asking your doubts through the comments only. (No IM / emails please )
Posted on October 28, 2008 with 7 Comments
There is a reason why I called you a ‘Hyper N00b’. I call myself noob, don’t know anything completely.. still learning.. etc.. are the reasons.. So if a noob is teaching someone something, I must call him Hyper Noob 
So you are looking for a n00b-ready tutorial to create WordPress themes ? Here we go I will teach you how to create a basic WordPress theme with common functionality.
I am not creating a unique thing here, similar tutorials have been made on the web by many good designers before I heard of WordPress ! Now you will ask ‘Then Why ?’ OK most of the tutorials is scaled to fit a normal guy who have an average knowledge about WordPress, php, html etc.. On my first day with WordPress Theme, It was a bit difficult for me to understand. And many of my friends came through IM’s asking for help and step by step information for creating a WordPress theme by their own. Sometimes it will be a bit annoying, answering their ‘hyper-noob’ questions Now you might have got an idea about what we are going to do.
This tutorial is splited into some episodes for easy grasping. Each day we will learn about some elements of a basic theme. Today we will by creating an environment for studying. Here our environment consist of an WAMP server, The WordPress Software, WordPress Codex as a reference (Please guys now use this one, am trying to simplify what CODEX says with my new ****** ) Some desktop Applications of course time and dedication.
Tools You Need
To run WordPress locally on the computer, you need to setup a AMP (Apache, MySQL, PHP) Software package, Many are there and you can choose accordingly Everything depends on the platform you are using, WAMP for Windows users, MAMP for Mac users, LAMP for Linux users etc… Here is the Complete list of AMP.
WordPress Codex has all explanations for you on ‘How to Create a WordPress theme’ But here am using WP Codex just to refer you about the Functions and Template Tags Used in WordPress themes. Don’t get nervous if I said something that you can’t grasp, Just leave a comment here, I will respond to you !. Install these things on your computer and wait for my next post, It will be posted soon for sure ! If you can’t Install WordPress, WAMP or anything email me or leave a comment here. If you have selected WebDeveloper Server Suit, WordPress should be Pre-Installed in it, If it is not the latest Just Upgrade it. and navigate to http://localhost/wordpress.
All the Tools I said above are noob ready there are many advanced softwares with simlar functions available, Its up to you which to choose, I will be following the listed things.
Tags: Code, CSS, Design, Free, HTML, Programme, Series, Template, theme, Tutorial, wordpress
Category: Tutorials
