Friday, 31 October 2014
Monday, 27 October 2014
Sunday, 26 October 2014
Here’s how to add an intro to your site:
1) Download intro.js from https://github.com/usablica/intro.js/tags (which also contains lots of example usages)
2) Add the bootstrap-responsive.min.css and introjs.css files to the head of your page (see lines 6 and 7)
3) Add data-step and data-intro attributes to the sections of your page where you want the introduction to display (see lines 11, 12 and 13)
4) Add a button or link which starts the intro (see line 14)
5) Add the intro.js file to the bottom of your page (see line 16)
Here is an example runs the intro only the first time a user visits your page
Friday, 24 October 2014
Wednesday, 22 October 2014
Generally I like Mail Chimp as a company and their UX so I might add to this blog post over time.
Nothing ground breaking here and it could be more responsive to the user as they insert data but I quite liked the green tick on green background to indicate a valid password. Perhaps the errors could be in a similar style.
Another data entry example
Wednesday, 15 October 2014
Here are a few quick UX tips, tricks and hacks taken from the Hacking the User Experience Pluralsight course.
UI redesigned to remove noise and simplify the design:
Leading the user
Visual clues added to lead the user through the process (step 1, 2 and 3):
Another option for leading the user is an introduction overlay:
A third option could be to introduce a wizard:
Some more UX resources:
To calculate which foreground color to use on a background we have the following function:
You can use this website to confirm it meets the W3C standards: http://snook.ca/technical/colour_contrast/colour.html
Tuesday, 14 October 2014
Monday, 13 October 2014
Here is a quick example of a data repository pattern used with EF. Note the UpdateEntity method in AccountRepository purely returns the entity to be updated, this perhaps should be named more clearly.
This example was taken from Miguel Castro and uses MEF as it's DI container.