This here is the most recent article, but you can browse all other sections below.

Sunday, October 14, 2012

The Kinfolk Magazine User Interface


The Kinfolk User Interface trips me a lot. Very minimalist and then easy to read. What works for the site is the use of whitespace and excellent layout and typography.

I am looking forward to designing something using this as an inspiration.

 


Friday, October 12, 2012

Google Bootstrap


Twitte released a frontend toolkit sometime in 2011 called Twitter Bootstrap.  It was an excellent time saver for many front-end designers with its stack of options which included component design snippets, javascript plugins, and forms.

There is now a Google Bootstrap, very much like its twitter counterpart. In fact, I suspect a lot of code from Twitter Bootstrap was reused to build the Google Bootstrap. But as a front-end designer, you’d find this extremely useful.


Friday, October 12, 2012

Line breaks or paragraphs not showing in WordPress


On a couple of occasions, I had either developed or reused WordPress templates that would mysteriously come up with situations where the text editor would not allow texts to be formated in such a way that when a new line, paragraph or break is called, it doesn’t reflect on the front end. After much suffering, I came across the solution from here.

All you do is give your break a class name. Say, ‘blank’.
That should fix it up.

Tags:

Thursday, October 11, 2012

I swear, in web design, there’s a law called Fitt’s Law


I swear there is a law called Fitt’s Law in web design. It states that the time and effort required to reach a target is dependent on the distance and size of the object on the page. This idea is emphasized by how humans interact with a computer. It plays an important role in the usability of a site by ensuring that important and distinctive content for your visitors remain within easy reach.

When I first came across this law, I thought ‘duh’. But then I have caught myself breaking such a common-sense law while designing User Interfaces where a lot of functions on the screen need attention.

I have even designed a search box without a button and thought ‘the user can just click enter’ when they are done. “Isn’t it cool?”. Cardinal usability objective lost!
Fitt’s Law and its concept have inspired other many modern trends where search boxes, sign up fields and sign up buttons are large. An example of a log in button can be seen on the WordPress.com website.


And sign up buttons on MailChimp.

 

While going through a few examples on the web where the use of the Fitt’s Law was consciously used, I stumbled on this video that proves that Apple’s Mac OS X breaks the law in a couple of design elements to the disadvantage of users.

 

In a nutshell, think usability, think making the important pop out!


Tuesday, October 09, 2012

How To Set Up The Tide SDK: Developing Desktop Applications with HTML5, CSS3 and Javascript


You downloaded Tide SDK, so what next?

Last night, I discovered you could actually build web applications with HTML5 and CSS3 with TideSDK using Titanium Desktop. It took me about 6 hours of searching and reading before I could finally understand how to set up the SDK and create an application with it. The documentation on the site was least helpful and to make matters worse, Titanium Desktop itself has been discontinued.

So I will write out a guide as to how to set up TideSDK and how to create your first Hello World application. Here are the steps.

  1. Download the SDK from the TideSDK website
  2. Download TiDev Community app. This will serve as your IDE.
  3. Download the HelloWorld files from the GitHub repository. The HelloWorld app teaches the following
    • The use of the API to create a menu
    • Adding a menu item to a menu with a simple callback to prompt the user to exit the app
    • Displaying content using HTML and CSS.
  4. Import the downloaded app(the HelloWorld) app to the application (Click on Import then locate the unzipped/untarred folder).
  5. Run the Hello World app! Click on ‘Test & Package’ button in the TiDev menu, then click on the ‘Launch App’ button in the lower left. The Hello World app will start and begin logging to the screen. Debugging statements you include in your code will appear.
Very straight forward. By looking at the source code, you will see a bit of how the Javascript syntax was used in creating the menus.
var menu = Ti.UI.createMenu(),
fileItem = Ti.UI.createMenuItem('File'),
exitItem = fileItem.addItem('Exit', function() {
  if (confirm('Are you sure you want to quit?')) {
    Ti.App.exit();
  }
});

menu.appendItem(fileItem);
Ti.UI.setMenu(menu);
I hope this helped somebody!

 

 


Sunday, September 23, 2012

The Business Analyst Versus The User Experience Analyst


If you have followed my blog or twitter updates of recent, you would notice my frequent (and maybe enthusiastic) mentions about my role as User Experience Designer. I am a lot excited about this new career path. After taking multiple courses, I have been able to practice on one or two clients. There are a few challenges I am facing at the moment. One is the scope of projects in relation to UX and the other is its adaptability. User Experience Design is something new around here. I am trying to tread carefully in educating clients on the immerse benefits of User Centered Design.

The first thing I have had to deal with are misconceptions about the role of the UX analyst. There’s an article on Mashable which talks on the various misconceptions. I guess I will write future articles on each of them in relation to my own personal experience.

The second thing I have had to contend with is overlapping roles between me, the  User Experience Analyst and the Business Analysts.

At work, part of our presales and after sales procedures for web development is getting the Business Analyst to analyse the business needs and requirements. Before the introduction of UX processes, we had graciously adapted more modern techniques like AGILE development methodology and then we had introduced the creation of user stories and personas. This seemed interesting at first. But now that I have gotten good knowledge of UX design and the practice, its easy for me to see where we could adjust processes to produce more successful products.

In the past I have had countless arguments with one of our closest business analysts, @adunholler about how our individual processes have overlapped. For instance, in creating user stories and work flow, I later found out that this is a part where the web leaning Business Analyst should not touch. And here are a few highlights:

  • User Stories and Persona Creation should be created AFTER RESEARCH ON USERS.
  • Wireframes are not just created as a pre-skeletal form of the end product just so the client can have a ‘pre-view’. Wireframes are supposed to highlight with details, the functionality of the web page/site as well as have reasons why a particular design decision had been taken
  • The Business Analyst and the User Experience Analyst should be the best of friends. While the UX Analyst should interface directly with both users and stakeholders, the Business Analyst is also the liaison officer between the stakeholders and the UX analyst and also the project manager.
  • Process flows drawn by the UX Analyst should be validated with the BA.

All in all, I enjoy UX work. It avails me the opportunity to listen to users. And then to look for creative ways to tackle design problems.

 

 

 

 

 


Thursday, August 30, 2012

Language translation functions on websites, the UX perspective.


Clientsfromhell.net is one website I visit to have a good laugh at all the client (im)possibilities. Reading other web developers’ frustrations may generate a laugh but dealing with clients first-hand may not reveal the same outcome. Sometimes you get the most ridiculous requests or  a request to make seemingly unreasonable changes to layouts or methods. Many of these requests may eventually seem beneficial to the client- but really who knows the business better than the project owner?

In my few months functioning as a User Experience Analyst, I have poured myself into books and trainings, online materials and forums where the challenges between the role of the user and the project owner are detailed. I have even thought of writing a book called Kill The Client, Users Are Now King.

I started a recent project using UX methodologies. One of the most successful projects I will be handling(at least from the looks). I was blown away when in between the project the project owners asked that a language translator be added to the site. It became an issue of discussion between my project manager and I.

You know it’s easy to integrate this function on any website. Just pull one or two plugins or extensions and you are good to go. But the question I kept asking myself is ‘Does this bring us to a positive outcome? ‘. The reason for the client’s inclusion of the Language Translation tool was because it is an international organization and users from other parts of the world visit the site.

I believe that irrespective of the fact that users visit from around the world, creating an automated script that translates the site content doesn’t increase the usability scores. Automatic language translations are never perfect(from my experience).  I believe they can hamper true user experience. Usability where locale is involved may require separate website sections custom created to serve the individual languages.

As I develop myself and mature in the UX field, my opinion may change. So I will be coming back to this space.

 


Tuesday, August 14, 2012

The 7 Smart Money Essentials Infographics


Spend Less Than You Earn
Rule Your Work Life
have an emergency fund
Save at least 10%
Limit Your Debt Infographic
Invest, Don't Gamble
protect yourself


Monday, July 02, 2012

To solve- Warning: Parameter 1 to modMainMenuHelper::buildXML() expected to be a reference…


To solve- Warning: Parameter 1 to modMainMenuHelper::buildXML() expected to be a reference, value given in /libraries/joomla/cache/handler/callback.php on line 99

I have spent 3 difficult weeks trying to solve an error with Joomla. I recently moved 5 websites from two different servers. The new server did not display any menus. Apparently error reporting was turned off.

I loaded it on my localhost and got the “Warning: Parameter 1 to modMainMenuHelper::buildXML() expected to be a reference, value given in /libraries/joomla/cache/handler/callback.php on line 99″ errors (see screenshot).

Here is the solution:

The site currently runs on Joomla 1.5. The previous server ran PHP 5.2.9 while the new server ran a later version of PHP, 5.3.0. This error is thrown because of the reference type used in the helper file.

Locate modules/mod_mainmenu/helper.php, open the file and change the following line from

function buildXML(&$params)

to

function buildXML($params)

Viola! You have your menus back.

 

I will warn you though, you have to upgrade to the latest version of Joomla.

 

Tags:

Sunday, May 06, 2012

How to be a Mensch


The Word of The Day for today’s Dictionary.com is Mensch. Co-incidentally I found a webpage of Guy Kawasaki’s that talks on How to Be a Mensch. Apparently, a mensch is defined as a person of integrity and honor.

Here are his points:

Here is my humble attempt to help you achieve menschdom.

  1. Help people who cannot help you. A mensch helps people who cannot ever return the favor. He doesn’t care if the recipient is rich, famous, or powerful. This doesn’t mean that you shouldn’t help rich, famous, or powerful people (indeed, they may need the most help), but you shouldn’t help only rich, famous, and powerful people.
  2. Help without the expectation of return. A mensch helps people without the expectation of return–at least in this life. What’s the payoff? Not that there has to be a payoff, but the payoff is the pure satisfaction of helping others. Nothing more, nothing less.
  3. Help many people. Menschdom is a numbers game: you should help many people, so you don’t hide your generosity under a bushel. (Of course, not even a mensch can help everyone. To try to do so would mean failing to help anyone.)
  4. Do the right thing the right way. A mensch always does the right thing the right way. She would never cop an attitude like, “We’re not as bad as Enron.” There is a bright, clear line between right and wrong, and a mensch never crosses that line.
  5. Pay back society. A mensch realizes that he’s blessed. For example, entrepreneurs are blessed with vision and passion plus the ability to recruit, raise money, and change the world. These blessings come with the obligation to pay back society. The baseline is that we owe something to society–we’re not a doing a favor by paying back society.

 


This article was written by Seye Kuyinu. I am a web applications developer with new interest in UX design. Lately, I have focused my attention from core web applications development to interface designs and development processes using User Experience principles. I am also an ardent fan of WordPress. I have a hang of the HTML, CSS, PHP, MySQL, ActionScript, JavaScript. In my spare time I play the violin. You can follow me on twitter: @seye


Article Browser