A B C of Design

Digital Design Essentials – The User Interface Guide

March26

My book Digital Design Essentials at Amazon

Reviewed by CHOICE

“This reference work illustrates 100 usability design tips for websites and other applications across devices, not only for aesthetics but also for functionality and ease of use. Lal, a digital product designer, addresses advanced website functions, including the creation of a shopping cart, reviews and ratings, mobile commerce, touch screen interfaces, infographics, APIs, and other current technologies. Each topic features a short instructional page with bullet-point recommendations and tips on what to include. A facing page shows real-world examples and/or case studies. Some of the text instructions refer readers to other entries with related design concepts. The content, organized into sections titled “Desktop,” “Web,” “Mobile,” and “Miscellaneous,” is well indexed. Rather than being a technical manual on how to create websites, widgets, or other applications, this volume presents best practices from an ease-of-use perspective. The examples undoubtedly will become outdated soon, but they represent some of the best illustrations of contemporary usability design. The rapid evolution of technology means that few books are available to compare with this one. It will be useful to those interested and/or active in web development or mobile app development.

Summing Up: Recommended. Lower- and upper-level undergraduates, general readers, professionals/practitioners.

–A. R. Hutchinson, Will Smithsonian Institution Libraries
Copyright 2013 American Library The Association

Digital Design Essentials: 100 ways to design better desktop, web, and mobile interfaces?

An ultimate guide to human computer interaction.

Check out the digital design essentials book at amazon.

Digital Design Essential

Whether dashboard software or a single-page website, a location-aware mobile app or a 10-foot TV interface, digital design is the tip of the iceberg; the actual design is not how it looks but how it works. Dive deep into the workings of one hundred popular desktop, Web, mobile, and TV user interfaces.

Digital Design Essential is a comprehensive, cross-disciplinary encyclopedia of user interface design. Richly illustrated and easy to navigate, it includes architectural views of the application, best practices and design guidelines, tips for creating a great user experience, along with live examples. Every major user interface concept is defined and illustrated for readers, including command line, “WIMP,” metro UI, skeuomorphic design, accessible web interface, e-commerce, zooming user interface, infographic design, adaptive interface, mobile lifestyle apps, voice interface, and intelligent user interface.

Learn best practices, design guidelines and pointers for creating a compelling user experience.

Digital Design Essential provides the experienced designer with an understanding of application design and user interfaces. Raj Lal points out the different components affecting the user experience and design principles applicable in an array of application interfaces, enabling the reader to understand the inner working of the application, plan key features, apply design guidelines, and choose the best practices instead of reinventing the wheel.

Digital Design Essential:

  • Provides a comprehensive guide to user interface design
  • Explains the know-how necessary to understand the application interface
  • Points out components affecting the user’s experience of the application
  • Provides user interface design guidelines and best practices for design
  • Illustrates concepts with a case study for each essential, using real-life examples

Digital Design Essential is an invaluable resource for graphic artists, UI designers, UX gurus, Web designers, RIA, mobile, and device developers.

Here is the Table of Content, a List of User Interface Design guidelines covered in the book

Desktop

  1. User Interface (Human Computer Interface)
  2. Command Line Interface
  3. WIMP Interface
  4. Graphical User Interface (GUI)
  5. Photo Editor
  6. Image Manager
  7. Desktop Explorer
  8. Assistant/Software Wizard
  9. Integrated Development Environment (IDE)
  10. Media Player
  11. Desktop Widget/Gadget
  12. Dashboard/Scorecards
  13. Instant Messenger (IM)
  14. Chat Room
  15. Video Chat
  16. Interactive Voice Response (IVR) System
  17. Direct User Interface
  18. 3D User Interface
  19. Metro UI/Modern UI
  20. Skeuomorphic Design/Faux Real UI

Web

  1. Web User Interface (WUI)
  2. Accessible Web
  3. Website
  4. Homepage
  5. Personal Website
  6. Single-Page Website
  7. Blog
  8. Blogger Template
  9. WordPress Theme
  10. Catalog
  11. Product Page
  12. Shopping Cart
  13. Checkout
  14. User Account/Registration
  15. Login
  16. User Profile
  17. Online Forums
  18. Comment Thread
  19. Sitemap
  20. Resource Center/Help Center
  21. Knowledgebase (KB)
  22. Wiki
  23. Online Surveys
  24. Rating App
  25. Rich Internet Application (RIA)
  26. Web Widget
  27. Book Widget
  28. Banner Ad
  29. Web Slideshow
  30. HTML5 App
  31. Zooming User Interface (ZUI)
  32. Task Tracking System
  33. Content Management System (CMS)
  34. Ajax Web Application
  35. Social Design
  36. Search Engine Optimized (SEO) Web Page
  37. Web 2.0 User Interface Design
  38. Service-Oriented Architecture (SOA) Design
  39. Infographics Design
  40. Adaptive User Interface

Mobile

  1. Mobile Phone App
  2. Mobile Web App
  3. Hybrid App
  4. Mobile Website
  5. Information App
  6. Mobile Utility App
  7. Lifestyle App
  8. Address Book
  9. Camera App
  10. Photo App
  11. Mobile Game App
  12. Location Aware App
  13. Branded App
  14. Consumer Service App
  15. Augmented Reality App
  16. Bluetooth App
  17. Near Field Communication (NFC) App
  18. Mobile Ads
  19. Mobile Commerce
  20. Mobile Search
  21. Mobile Home Screen
  22. Touch User Interface
  23. Multi-Touch User Interface
  24. Accessible Touch User Interface
  25. Gesture-Based User Interface
  26. Pen-Based Interface
  27. Mobile Clock App
  28. World Clock App
  29. Mashup App
  30. Voice User Interface

Miscellaneous

  1. 10-Foot User Interface
  2. Games UI
  3. Welcome Email
  4. Email Marketing Campaign
  5. Email Newsletter
  6. E-zine
  7. Natural User Interface
  8. Natural Language Interface
  9. Intelligent User Interface
  10. Organic User Interface

 

posted under Design | No Comments »

Apple’s design process

May26

Interesting presentation at SXSW from Michael Lopp, senior engineering manager at Apple, who tried to assess how Apple can ‘get’ design when so many other companies try and fail. After describing Apple’s process of delivering consumers with a succession of presents (“really good ideas wrapped up in other really good ideas” — in other words, great software in fabulous hardware in beautiful packaging), he asked the question many have asked in their time: “How the f*ck do you do that?” (South by Southwest is at ease with its panelists speaking earthily.) Then he went into a few details:

Pixel Perfect Mockups
This, Lopp admitted, causes a huge amount of work and takes an enormous amount of time. But, he added, “it removes all ambiguity.” That might add time up front, but it removes the need to correct mistakes later on.
10 to 3 to 1
Apple designers come up with 10 entirely different mock ups of any new feature. Not, Lopp said, “seven in order to make three look good”, which seems to be a fairly standard practice elsewhere. They’ll take ten, and give themselves room to design without restriction. Later they whittle that number to three, spend more months on those three and then finally end up with one strong decision.

Paired Design Meetings
This was really interesting. Every week, the teams have two meetings. One in which to brainstorm, to forget about constraints and think freely. As Lopp put it: to “go crazy”. Then they also hold a production meeting, an entirely separate but equally regular meeting which is the other’s antithesis. Here, the designers and engineers are required to nail everything down, to work out how this crazy idea might actually work. This process and organization continues throughout the development of any app, though of course the balance shifts as the app progresses. But keeping an option for creative thought even at a late stage is really smart.

Pony Meeting
This refers to a story Lopp told earlier in the session, in which he described the process of a senior manager outlining what they wanted from any new application: “I want WYSIWYG… I want it to support major browsers… I want it to reflect the spirit of the company.” Or, as Lopp put it: “I want a pony!” He added: “Who doesn’t? A pony is gorgeous!” The problem, he said, is that these people are describing what they think they want. And even if they’re misguided, they, as the ones signing the checks, really cannot be ignored.

The solution, he described, is to take the best ideas from the paired design meetings and present those to leadership, who might just decide that some of those ideas are, in fact, their longed-for ponies. In this way, the ponies morph into deliverables. And the C-suite, who are quite reasonable in wanting to know what designers are up to, and absolutely entitled to want to have a say in what’s going on, are involved and included. And that helps to ensure that there are no nasty mistakes down the line.

by: Helen Walters on March 08, 2008

posted under Design | No Comments »

6 Bold New Year Resolutions

January2




Time for New Year Resolutions !
————————————-

Here are few of mine to get you started !

1. Be Bold in Executing Ideas !

Because “Most ideas never work – unless you make sure they do” and “The bold idea has a higher probability of realization than the conservative one” – Genrich Altshuller

2. Read More Great Books

No matter how busy you may think you are, you must find time for reading, or surrender yourself to self-chosen ignorance. – Confucius

3. Learn something new ! Photography ?

“Twenty years from now you will be more disappointed by the things you didn’t do than by the ones you did do. So throw off the bowlines. Sail away from the safe harbour. Catch the trade winds in your sails. Explore. Dream. Discover.” Mark Twain

4. Think/ Write about Design

“Design is not how it looks, Design is How it Works” – Steve Jobs

5. Talk/Present and Share your knowledge on Technology

Sharing teaches you more than Learning

6. Have More Fun !

“If you are not having FUN you are NOT doing it right” – Bob Basso

So, what’s your Resolution ?

posted under Design | No Comments »

Patterns of Human Interaction by Marco Ahtisaari

December5

Recently I came across a presentation on “Patterns of Human Interaction” by Marko Ahtisaari (Global head of Nokia Design) at Copenhagen Design Week, which not only blew my mind, but changed my perspective about presentation all together.





About the presentation
Five billion people have a mobile phone. Today, no single, technological device is more in our hands than the mobile phone – it has become the media through which humans interact.


Marko Ahtisaari is the global head of Nokia’s design unit, and he is responsible for Nokia’s product and user experience design. During Copenhagen Design Week, Marko shared Nokia’s thoughts on how design will shape and influence the patterns of human interaction in the future at a Nokia event at Bella Sky Hotel.

What I found unique about the presentation is, Marko leaves a deeper impact without trying hard to sell. Its plane awesome, and it is modest and it is honest, which I think appeals to everybody equally. Marko is well dressed and extremely efficient in his walk, and he talk with a very positive body language. He always seems to be at ease and is smiling most of the time in a most friendly manner. Each of his words tell, he is clear and concise, he does not repeat, he does not overstate, his words all fit precisely in his talk. He makes a point he is trying to make, in a straight forward and most effective manner. And most important of all his presentation does not even have any bells and whistles.

Blank white screen with a white door ! amazing !

Most of the first few pages are hand drawn concepts or a single image. No chimming sounds, no explosion effects and no cutting edge graphics. 

Absolutely awesome ! My new idol ! If you want to learn how to present well learn from him Marko Ahtisaari (The Best presenter I have seen in the world). Each and everything he does is simple, yet mind blowing.

That also reminded me of something very unique, when I joined Nokia 2 1/2 years ago. I came to know that Nokia is all about “Being Humble” and I think thats the finiish culture completely opposite of American culture, which is a bit more aggressive salesmanship like ofcourse Steve Jobs.


Thank You for the Inspiration Marco Ahtisaari


Here are excerpts from another blog about the same presentation .


http://raesmaa.wordpress.com/2011/09/10/the-finnish-awesomeness-and-entrepreneurship/




The Finnish Way of Being
Serendipitously I happened to bump into another type of Finnish awesomeness.  I listened to Senior VP of Design at Nokia Marko Ahtisaari’s presentation at the Copenhagen Design Week.
The first 12 minutes (the rest of it is mostly about Nokia design and future development, interesting as well) of his speech ‘Patterns of Human Interaction’ had an effect on me. His humble way of speaking about how better design can help us to make each other feel that we are welcome, is just awesome. A beautiful perspective! 


Another observation I made is his style of speaking, it is very Finnish (read: very non-American). He is not shouting and feverishly waving his hands – no, instead he applies the traditional Finnish style: he is calm, speaks very softly and is overall adorable and kind. And all that without being boring. It kind of reminds me of the way Facebook’s COO Sheryl Sandberg speaks. Or Alex Osterwalder, or Aalto Entrepreneurship Society’s president Miki Kuusi. So I warmly recommend you to listen to Marko, at least the first 12 minutes.


Small Talk and Positive Silence


These great people and the two events – AaltoES with Steve Blank & Marko Ahtisaari and his talk about more human design principles – made me think about what is “Finnishness”, and why I’ll find it awesome and full of possibilities for the entrepreneurship too.
The Finnishness?, you may ask. Yes, we do have some national characteristics that can be more rare among other nationalities, we can be seen as very shy, but on the other hand our curiosity and creativity makes it easy for us to connect and share. To connect and share, and most importantly to listen. On top of that we are very persistent and diligent; we don’t like to give in. Except in football.
We Finns can easily be silent in company with other people. It’s natural. Foreigners often find our silence odd, or fascinating. Professor of Communication Donal Carbaugh, from University of Massachusetts at Amherst, have written an excellent paper about this – Silence and Quietude as a Finnish“Natural Way of Being” [pdf], with the following description:

“A Finnish communication code that structures some cultural scenes as occasions for positive silence, exhibiting a social model of personhood for which this is a valued, respected, and natural practice.”



I just love this expression, positive silence. Please consider positive silence as time for thinking, reflecting, and listening. The paper explains the Finnish way of communication with many good example stories; it can truly help in understanding us Finns…


Another great read is this short article of the Helsinki Times – No small talk please, we’re Finnish, in which freelance journalist Susan Fourtané describes her experiences:

“I particularly enjoyed the thoughtfulness and the moments of silence in between, giving space for observing our own thoughts before speaking. Yes, you have heard it right. Finns don’t do small talk. They don’t think a moment of shared silence is awkward. On the contrary, it is part of the conversation. A direct question gets a direct answer. There is no nonsense talk about nothing. There is no asking “How are you?” ten times until someone says something else, or stating the obvious. Finns are more interested in how you think, how you perceive Finland or what keeps you in this small and cold country, as they refer to beautiful and peaceful Finland.”



Less small talk and more positive silence, I believe that this enables better listening, and further better understanding.

posted under Design | No Comments »

The Greatest Designer Ever – Steve Jobs

December5

Here are my favorite 7 Quotes from Steve Jobs and few of his videos. If this does not inspire the design mojo in you then I don’t know what will.

1. Computers are like a bicycle for our minds.

2. Good artists copy great artists steal

3. Design is not just what it looks like and feels like. Design is how it works.

4. Do you want to spend the rest of your life selling sugared water or do you want a chance to change the world? - To get John Sculley as Apple’s CEO

5. Make it like a sunflower.
Steve Jobs, CEO, Apple, to Johnathan Ive, Vice President of Design, Apple, on prev version of iMac

6. Here’s to the crazy ones, the misfits, the rebels, the troublemakers, the round pegs in the square holes… the ones who see things differently — they’re not fond of rules… You can quote them, disagree with them, glorify or vilify them, but the only thing you can’t do is ignore them because they change things… they push the human race forward, and while some may see them as the crazy ones, we see genius, because the ones who are crazy enough to think that they can change the world, are the ones who do. — narrated by Steve Jobs

7. Be a yardstick of quality. Some people aren’t used to an environment where excellence is expected.

8. Innovation distinguishes between a leader and a follower.

9. When you’re a carpenter making a beautiful chest of drawers, you’re not going to use a piece of plywood on the back, even though it faces the wall and nobody will ever see it. You’ll know it’s there, so you’re going to use a beautiful piece of wood on the back. For you to sleep well at night, the aesthetic, the quality, has to be carried all the way through.”

10. “Click. Boom. Amazing!” – Macworld keynote 2006

11. “I would trade all of my technology for an afternoon with Socrates.”
—Newsweek, 2001

12. “I want to put a ding in the universe.”

13. I make 50 cents for showing up … and the other 50 cents is based on my performance.
On his famous $1 annual salary, at the annual Apple shareholder meeting in 2007, as quoted in “Jobs: ‘I make fifty cents just for showing up’” in AppleInsider (10 May 2007)

14. “I’m convinced that about half of what separates the successful entrepreneurs from the non-successful ones is pure perseverance.”

15. People with passion can change the world for better !

posted under Design | No Comments »

10 Design Principles

October23

Stumbled across this amazing 10 design principles by Dieter Rams, one of the Germany’s best known industrial designer, a living legend.

Good design:

  1. Is innovative – The possibilities for innovation are not, by any means, exhausted. Technological development is always offering new opportunities for innovative design. But innovative design always develops in tandem with innovative technology, and can never be an end in itself.
  2. Makes a product useful – A product is bought to be used. It has to satisfy certain criteria, not only functional, but also psychological and aesthetic. Good design emphasizes the usefulness of a product whilst disregarding anything that could possibly detract from it.
  3. Is aesthetic – The aesthetic quality of a product is integral to its usefulness because products are used every day and have an effect on people and their well-being. Only well-executed objects can be beautiful.
  4. Makes a product understandable – It clarifies the product’s structure. Better still, it can make the product clearly express its function by making use of the user’s intuition. At best, it is self-explanatory.
  5. Is unobtrusive – Products fulfilling a purpose are like tools. They are neither decorative objects nor works of art. Their design should therefore be both neutral and restrained, to leave room for the user’s self-expression.
  6. Is honest – It does not make a product more innovative, powerful or valuable than it really is. It does not attempt to manipulate the consumer with promises that cannot be kept.
  7. Is long-lasting – It avoids being fashionable and therefore never appears antiquated. Unlike fashionable design, it lasts many years – even in today’s throwaway society.
  8. Is thorough down to the last detail – Nothing must be arbitrary or left to chance. Care and accuracy in the design process show respect towards the consumer.
  9. Is environmentally friendly – Design makes an important contribution to the preservation of the environment. It conserves resources and minimizes physical and visual pollution throughout the lifecycle of the product.
  10. Is as little design as possible – Less, but better – because it concentrates on the essential aspects, and the products are not burdened with non-essentials. Back to purity, back to simplicity.

About Dieter Rams

Rams is possibly the most well-known German industrial designer, who not only produced—or directly oversaw— the design of more than 500 products in the course of his 40 years of service for Braun, but also established and headed a design department, which was extremely productive and made a global enterprise out of the company Radio Braun of Frankfurt. To date, Rams and Braun represent what is considered the typical German design approach, in which thoroughness, straightforwardness, clarity, and meaningfulness play a special role.

Born in Wiesbaden in 1932, the much-honored and highly distinguished designer was a graduate of the innovative Wiesbaden Werkkunstschule. Following his initial employment in the architectural firm of Otto Apel, Rams took a position at Braun in 1955 as an interior designer. At the time, the two young Braun family heirs, Erwin and Artur Braun, were in search of a new approach to the design of their radios, shavers, and household appliances in a manner keeping with the spirit of the times. In the “Braun lab” of the 1950s, to which the Bauhaus designers Wilhelm Wagenfeld and Herbert Hirche as well as the young design academy Hochschule für Gestaltung in Ulm contributed substantially, Rams soon took a leading position; in 1961 he was appointed head of the newly established design department. Already in the early years of the new decade, Braun design earned the highest recognition through awards and exhibitions at the Milan Triennale, the World Fair in Brussels, and the Museum of Modern Art, New York. Rams’s furniture designs for Vitsœ further carved out a permanent place for their products in the residential environments of contemporaries with a modern consciousness.

posted under Design | No Comments »

More LFI featured Photographs (6,7, and 8)

August24

Three more photos at Leica Fotografie International, here.
My Gallery here

Here is the photograph I took using Leica X1, of Golden Rose at San Jose Rose Garden, which was chosen by Leica Fotografie International in the Master Shots section.

Q: What make this photo extraordinary ?
A: 6 Elements of Composition.

1. Center of Interest
2. Rule of Thirds
3. Details
4. Bright Color
5. Perspective (flower size)

That adds up to 60 in PhotoScore.

Second photograph I took using Leica X1, of blue spring flower in my front yard, which was chosen by Leica Fotografie International in the Master Shots section.

Q: What make this photo extraordinary ?
A: 6 Elements of Composition.

1. Center of Interest
2. Rule of Thirds
3. Repetitive pattern, flowers
4. Diagonal Lines with space toward the direction
5. Fill the Frame
6. Perspective (flower size)

That adds up to 60 in PhotoScore.

Leica X1, of light purple spring flower in my front yard, which was chosen by Leica Fotografie International in the Master Shots section.

Q: What make this photo extraordinary ?
A: 6 Elements of Composition.

1. Center of Interest
2. Rule of Thirds
3. Repetitive pattern, flowers
4. Spot of Color
5. Fill the Frame
6. Perspective (flower size)

That adds up to 60 in PhotoScore.

posted under Design | No Comments »

Creating a User Interface for a Digital Photoframe

July30

Another of the User Interface idea for digital Touch Screen devices. Got the Patent for this design invention, which I filed at Sony Electronics, San Diego few years ago.

Abstract
———
A digital picture frame has a frame bounding a touch screen that presents a user interface having first and second arcs of selector elements. The first are of selector elements is manipulable to establish an input genre root, and the second arc is manipulable to select an input branching from a genre root selected using an element in the first group. The arcs are rotatable to reveal previously unpresented selector elements when a person moves a hand along the respective arc.

http://www.google.com/patents/about?id=l_LWAAAAEBAJ

Here are the Slides for the idea.

Let me know what you think

posted under Design | No Comments »

Creating a User Interface for Mobile Device

July30

Here is an idea based on Honeycomb !

The two Design Patents, for Honeycomb design for Mobile devices, Both were filed by Sony Electronics, San Diego. Honeycomb type design was used in the Microsoft Mobile 6.5, and hopefully we will see more Sony devices based on the patent.

Here are the links to the two design patents:

A User Interface for Mobile device inspired by Honeycomb structure with Hexagonal Grid
Basis :
  • 1. Hexagon structure gives the optimum space for individual Plug-ins
  • 2. Hexagon structure is best suited for Thumb Interaction
  • 3. Hexagon structure gives consistency in user interface
  • 4. Hexagonal structure is uniquely suited for both Right handed as well as Left Handed persons which is most important in a Mobile device interaction.
HEXAGONAL HONEYCOMB CONJECTURE: The proof that hexagonal tiling provides the least-perimeter way to enclose infinitely many unit areas. This is useful for us as we can have any number of plugins and displaying the plugins ICON view in a Hexagonal structure can give the optimum usage of space.

Weblinks

  1. Honeycomb Conjecture
  2. Full Proof Honey Comb conjecture PDF Format
  3. Frank Morgan’s Math page on Honeycomb structure
  4. Honeycomb corner angles analysis
  5. Download Documents of the Conjecture
posted under Design | No Comments »

Leica Fotografie International featured Master Shot (5th)

June14

Here is the photograph I took using Leica V Lux, of light purple spring flower in my front yard, which was chosen by Leica Fotografie International in the Master Shots section. Here (Blue Spring Flower)

Q: What make this photo extraordinary ?
A: 6 Elements of Composition.

1. Center of Interest
2. Rule of Thirds
3. Repetitive pattern, flowers
4. Diagonal Lines with space toward the direction
5. Fill the Frame
6. Perspective (flower size)

That adds up to 60 in PhotoScore.

Here is my FlickR link and here are my other pictures at LFI.

More Leica Fotografie International featured Master Shots

June8

Here are two photographs I took using Leica V Lux, of the 17th Mile and tiny spring flowers chosen by Leica Fotografie International in the Master Shots section.

1. 17th Mile Drive

Q: What make this photo extraordinary ?
A: 5 Elements of Composition.

1. Perspective
2. Direction
3. Depth
4. Unique Angle of View
5. Multiple Layers of interest

That adds up to 50 in PhotoScore.

2. Tiny Spring Flowers

Q: What make this photo extraordinary ?
A: 6 Elements of Composition.

1. Fill the Frame
2. Center of Interest
3. Bright Color Red
4. Rule of Thirds
5. Depth of Field
6. Spot of Color

That adds up to 60 in PhotoScore.

The first two pictures in the screenshot below

Here is my FlickR link and here are my other pictures at LFI.

Logo idea for Human Rights

May18

Here is my logo idea for Human Rights,

‘Right’ Hand at Heart

‘Call against Rights Violation’

A Human with a right symbol which symbolizes a “one hand call out” against rights violations

if you like it Vote for it here
http://humanrightslogo.net/ideas/14568

http://humanrightslogo.net/ideas/14080

posted under Design | No Comments »

Leica Fotografie International featured Master Shot (2nd)

April19

Here is the photograph I took using Leica V Lux, of BEAN of Chicago, which was chosen by Leica Fotografie International in the Master Shots section. Here (Photographing the Bean of Chicago)

Q: What make this photo extraordinary ?
A: 6 Elements of Composition.

1. Simplicity (no background distraction)
2. Center of Interest
3. Repetitive patterns
4. Unique Perspective
5. Beauty of the Architecture
6. Morning Light

That adds up to 60 in PhotoScore.

Here is my FlickR link and here are my other pictures at LFI.

posted under Design | No Comments »

Leica Fotografie International featured Master Shot

March15

Here is the photograph I took using Leica V Lux, at Farmer’s Market Mountain View, which was chosen by Leica Fotografie International in the Master Shots section. Here (Tomato Test 2nd one)

Q: What make this photo extraordinary ?
A: 7 Elements of Composition.

1. Center of Interest
2. Rule of thirds
3. Vibrant color
4. Repetitive patterns
5. Living person
6. Story (tomato test)
7. Perspective

That adds up to 70 in PhotoScore.

Here is the link to individual picture at LFI, and here are my other pictures at LFI. This picture is going to be featured in the book Universal Elements of Composition in Photography, coming soon.

posted under Design | 2 Comments »

10 Tips for Mobile Website Design

November21

My presentation at MeeGo Conference Dublin, Ireland (18th Nov.)

Session Summary:
How to create a mobile version of your website? Do you need to optimize your current website for mobile devices or design a completely new website? Do you need to worry about different platforms, Windows Mobile, iPhone, Symbian, Blackberry, Linux, Brew, Android, Nokia and MeeGo? What resolution, what screen size you should target, and what is this PPI anyway? In this session, mobile web usability expert and co-author of Beginning Smartphone Web Development, Rajesh Lal will discuss ten pragmatic tips, for designing website for mobile devices.
Session Abstract:

Ten Tips to design Mobile website for maximum number of users and devices in the least amount of time.

posted under Design | No Comments »

Ineffective Web Campaign

October26

Mojave Experiment for Windows Vista

The Mojave Experiment was an advertising campaign by Microsoft for Vista operating system. The participants were asked about their perceptions of Windows Vista and then were shown a ten minute demo of Microsoft’s “next OS,” codenamed “Mojave.” After the experiment was over, it was revealed that “Mojave” was actually Windows Vista.

http://www.microsoft.com/windows/mojave-experiment/

http://en.wikipedia.org/wiki/Mojave_Experiment

The campaigne was ineffective in two ways
It never looked real, it looked all staged up and scripted
It never addressed the real problem

When Windows Vista came up it had this new “annoying” security feature which prompted the user. The Mojave experiment assumed that the users are not trying Vista for the first time because of the bad marketing, but the actual problem was users were trying the new OS and then downgrading to Windows XP because of the Bad User Experience. This give great example of an ineffective campaign.

If I have to revitalize it first thing I would do is find out
The real issue behind all the bad words for Windows Vista
Try to address those in a transparent way
By accepting the truth and trying to fix it would be better campaign then cherry-picking positive feedbacks from users
If there were security concerns the campaign could also have explained the “why” user are prompted to install and would have genuinely tried to figure out a solution

Interestingly this situation was capitalized by Apple here PC Security Cancel or Allow very effectively .

posted under Design | No Comments »

Using the Web Effectively

October26

Social Media is the New Trend

Now a days Social networking websites like Facebook and Twitter are used for maintaining a brand loyalty on the web. When a web user “become a fan” on facebook or “follow on twitter” he has the percieved personal connection with the brand and gets updated on the latest happenings on the brand. Facebook keep the customer engaged with games, prizes, discounts etc. For the example in hand Cocacola brand has a facebook page at http://www.facebook.com/cocacola which can be thought of as an extension to their web identity or website to get closer to the people. Twitter is another of the microblogging websites where customers are encouraged to “follow” the brand and get updates when it happens. http://twitter.com/cocacola. Both these websites provide customizability to the color and layout to align with the brand.

Other websites which are used to keep the user engaged are blogs, wikis, discussion forums, youtube page, flickr page, slideshare, etc. The more presence the brand has among these websites the more customers they have.
The study scores the engagement level of each of the top 100 brands across more than ten social media channels, including blogs, Facebook, Twitter, wikis, and discussion forums. Starbucks scored the highest, with 127 points. The top ten brands are:

1. Starbucks (127)
2. Dell (123)
3. eBay (115)
4. Google (105)
5. Microsoft (103)
6. Thomson Reuters (101)
7. Nike (100)
8. Amazon (88)
9. SAP (86)
10. Tie – Yahoo!/Intel (85)

http://techcrunch.com/2009/07/20/the-most-engaged-brands-on-the-web/

posted under Design | No Comments »

Rules for Fonts and Typography

October25

It is an exciting time. New fonts are being introduced daily. Through the Internet, every font that exists is available to you today, this very minute. Just knowing they are out there makes us want to see them and use them.

Not only do designers have to know the personality and the voice of the fonts that they use in their letterhead, ad, and brochure designs, but they also have to know what fonts work best for screen-based presentations. Believe it! There are some fonts that work for Internet, multimedia, and streaming video, and some that don’t. For more information regarding the basics of type for the screen, visit
www.will-harris.com/typoscrn.htm.

When it comes to typography, the rules have been as follows:

“Never use more than two typestyles on a page.”

“Use only one family of typefaces.”

“If you must use two styles at all, use sans serif for headlines and serif for body type.”
Well, it is possible to use three or four faces, but it is not easy. Communication must be clear. The difference must be evident, if not obvious. Always use contrast. Contrast can be size, weight, color, or voice. Interest is paramount, as long as you remember that readability is paramount. Get it? Just be careful.

We have not, as you notice, gone into a deep discussion of the vast selection of display types on the market — the grunge or dirty types, the fancy and frilly types, the odd and trendy types. The basic rules that we all seek to break are still the rules of good typography. Remember that you are first a communicator, second a designer, and third an artist. There is room for you to be all three if you use good sense.

The major consideration in seleting a typeface for display and bodytext is “Easy to read” and “clarity of output”. The reason can be contributed to the difference of pixel count on screen and print. Serif fonts look beautiful on print but the same might look clutterred on display screen. The choice should be made based on the following points
If the large size has to be used Any typface is ok for on-screen.
For smaller text Sans-Serif is preferred, or a font with simpler letterforms and larger x-heights.
Touching letters should always be avoided or extra tracking need to be added to make things clear.
What might be the variations for

a> Retail toy store
Needs much more ease of readability for the potential children target customer. Large Face and Sans Serif is better idea.

b> An investment counseling service
Fonts needs to display seriouseness, which is better done with Serif Fonts like Times New Roman with a more professional appeal.

c> An Internet service provider
Content is the king here so clarity is desired, San serif font like Arial like font is preferred

d> An ethnic restaurant
I think this is a place for a designer to experiemnt with newer fonts and try the fancy and the frilly types.

Outward factors which decides legibility is where the font is used display or print. Print has more DPI then Display which allows for more versatile serif fonts.

When display on a computer, a number of features of the font can decide legibility
Size: Large size are more legible for any fonts
In small Size, simpler fonts and Sans serif fonts are more legible
Larger X height is a font make it more legible
Extra tracking between letters can make the font more legible
Well hinted font can be more legible

posted under Design | No Comments »

Key factors for Image in Design

October24

The Key factor in choosing photography and illustration is the “realness” of the design problem in hand. By realness I mean the more you want your design to be real the more you use a photograph, the more you want your design to be abstract and open for discussion the more you want to use illustration.

You can think of these two Photograph and Illustration on the two extreme sides of the scale. and your design problem can be somewhere in between those as shown below.

Illustration ————————————————–Photograph
^
|
Your Design (some where in between)

An illustration leaves more to the mind to imagine and give a broader appeal, where as a Photo give a “now” and “here” feeling by showing facts to you, see picture example attached.

posted under Design | No Comments »

Reasons and values behind the process of Thumbnailing

October23

Thumbnails give variety

The reason: process of thumb-nailing in a big quantity give a number of advantages:
It give a good start towards the design process
When a designer is creating thumbnails, he is not restricted to any structure and, process he can design thumbnail in a process similar to lateral thinking, completely free flow and unstructured, this result in a variety of designs which is the key benefit of the process.
During the process the designer put down every possible idea he can come up with and so brainstorming happens and he put down all his thoughts related to the design problem in hand.

Thumb-nailing down also allow you to push your mind to come up with different ideas for the same problem, this also stretches your mind to think of new solutions, which show up after putting down the most common ideas.

The value of thumb-nailing lies in the following
The designer don’t have to invest a lot of time on any particular design in the early stage, so saves some work.
The designer can showcase his ideas to the client and get his feedback, this is an important step towards understanding the clients requirement and choice.
More number of thumbnails provide you with a lot of raw material to think about the design problem, how each solves and fits in the current design.

The early stage of Conceptual thinking, which is putting down the basic idea in the form of thumbnails or thumb-nailing can be done very effectively without computers. At this stage the mind is flowing freely and is pushing you to think in every possible directions. A mental map of the design problem in hand goes in all directions, here a computer can restrict more than adding to the process. Because at some time you might want to express something in 3d, something in different shades, shadows, colors and different scale, these aspects of thumb-nailing is very efficient when the mind works with eye and a hand and Pencil in perfect synchronization. No computer can beat the speed with which a mind can come up with new ideas.

At a later stage when you want to try different color schemes to your concept or thumbnails, try with different layout options etc a computer can be an effective tool. With photo editing softwares and 65000 color options. you can almost see all your concept in multiple formats and layouts in no time and judge them for their effectiveness. So this is place where a computer can help on conceptual thinking, to finalize your concept, to experiment with different colors, shades, tones and dimensions.

In conclusion I would say the concept creation process is faster when doing with hand but the editing can be effective when doing with a computer.

posted under Design | No Comments »
« Older Entries

Digital Design Essentials

 
Digital Design Essentials - May 2013
100 ways to design better desktop, web, and mobile interfaces


My New Book

 
Fun with Silverlight 4
(Amazon)

Silverlight Fun Widget

Free Fun Widget

Yours Truly

Connect with me

      
      

My Article at MSDN Magazine


Developing 3D Objects

(Fun with Silverlight 4)

My Other Books

 
Beginning Smartphone Web Development
(Amazon)  
Developing Web Widget
(Amazon)
Creating Vista Gadgets with... Silverlight
(Amazon) Codeproject MVP 2008
My Articles at CodeProject View Rajesh Lal's profile on LinkedIn

Enter your email address:

Delivered by FeedBurner