archive-com.com » COM » S » SVENNERBERG.COM

Total: 274

Choose link from "Titles, links and description words view":

Or switch to "Titles and links view".
  • UX | In usability we trust
    to create amazing context aware first Person UI s Imaging for a moment that you re in a foreign city standing in front of a statue that you never seen before Point your mobile phone at it and it will tell you what it is who built it etc imposing the information as a layer over the reality Continue reading Forms that Work April 21 2009 Gabriel Svennerberg 3 Comments Forms that Work is a book on how to design web forms properly Some time ago I reviewed a similar book Web Form Design by Luke Wroblewski which deals with the same subject I then thought that this was a very narrow scope for a book but perhaps it was not since this book was published shortly after No doubt web forms are all around us so the need for knowledge and skill to design them well should be great I certainly can t seem to get enough of these books Continue reading The rise of Zooming User Interfaces February 19 2009 Gabriel Svennerberg 12 Comments The first time I ever read anything about Zooming User Interfaces was when I was reading The Humane Interface by Jef Raskin where he introduced the concept of Zoom World a whole OS based on a Zooming User Interface ZUI Of course this wasn t my first encounter with this type of user interface since I ve among other things been using Interactive maps like Google Maps But it was the first time that I started considering a Zooming Interface a viable alternative to the traditional interaction idioms In this article I will explore some of the Zooming User Interfaces out there today and also take a sneak peak of what s around the corner Continue reading Different approaches to communicate UX design January 29 2009 Gabriel Svennerberg 0 Comments Peter Morville at Semantic Studios has compiled an extensive list of ways to create deliverables to communicate uX designs He writes about this in User Experience Deliverables The article contains a list of 20 techniques with links to further reading on each To make it easier to find suitable techniques he also made a Treasure Map pdf so it s easier to see what your options are Or as Peter himself put it It s hard to find the best trees when we can t see the forest So we often fall back on old habits We churn out wireframes when a story may be worth its weight in gold Some great deliverables stay hidden in plain sight That s why we created this treasure map for our wall and yours Peter Morville Spotify is right on the spot November 19 2008 Gabriel Svennerberg 7 Comments I ve been using the beta web service Spotify for a couple of months now And I must say that I m really impressed I would almost go as far as to say it s the best piece of software I have ever used Continue reading Shopping for

    Original URL path: http://www.svennerberg.com/tag/ux/ (2016-04-28)
    Open archived version from archive


  • Touch | In usability we trust
    a single purpose to get people to click on them Yet a lot of times designers fail to make links or buttons look clickable In fact while this might seem like a no brainer a lot of sites get it wrong Continue reading About me My name is Gabriel Svennerberg and I m a UX Designer Frontend Specialist and Author from Sweden More about me I m located in Växjö

    Original URL path: http://www.svennerberg.com/tag/touch/ (2016-04-28)
    Open archived version from archive

  • Web Design | In usability we trust
    for a single purpose to get people to click on them Yet a lot of times designers fail to make links or buttons look clickable In fact while this might seem like a no brainer a lot of sites get it wrong Continue reading About me My name is Gabriel Svennerberg and I m a UX Designer Frontend Specialist and Author from Sweden More about me I m located in

    Original URL path: http://www.svennerberg.com/tag/web-design/ (2016-04-28)
    Open archived version from archive

  • Design for Clickability | In usability we trust
    underline text just to emphasize it Account for color blindness Don t forget that about 8 of the male population are color blind Having something more than just the color to distinguish links is therefor a good idea Not just text links The same thinking goes for other things that are clickable such as buttons checkboxes select lists images etc Make sure that these too actually look clickable For buttons that can mean to make them look like physical buttons with a 3D effect This makes them stand out from the page and look more like physical objects The button on the left could just as well be a banner or a header while the button on the right is begging to be clicked Provide clues Also make sure to provide other clues when the user moves the cursor over the object The cursor itself could for example change to a pointing hand which carries a strong affordance of clickability This happens by default over links in browsers but you could use a little CSS to create this effect on other clickable elements as well Another good idea is to make something happen with the clickable object itself when it s being hovered One common clue is to change the background color This is easily achieved with the hover pseudoclass in the CSS clickable item hover cursor pointer background color ff9 Accomodate for keyboard Some people prefer to use the keyboard instead of a mouse for one reason or the other Don t forget to take this into account when providing clues Links and form elements are easily reachable by keyboard by just tapping the tab key For the user to know which element currently has focus most browsers create a dotted outline around the element That s a pretty good affordance but you could make it even more clear An easy thing that I often do is to make it have the same style as on hover This is easily accomplished with CSS by using the focus pseudoselector clickable item hover clickable item focus cursor pointer background color ff9 Pro Tip If you don t like the dotted outline you can get rid of it by setting outline to none in the CSS Don t forget to design for touch On touch devices there are no such things as a hover It s therefor extra important to make clickable objects look clickable You will also want to make the click area bigger to accommodate for the fat finger syndrome but that s a topic for another article Fast facts Affordance The term Affordance was popularized by Donald Norman in his seminal book The Psychology of Everyday Things He later changed the term to Percieved Affordance since too many misunderstood what he meant by it Actually his latest term for this is Signifiers but that term hasn t gained much traction yet The Percieved Affordance is the properties of an object we understand by just looking at it For example

    Original URL path: http://www.svennerberg.com/2012/12/design-for-clickability/?replytocom=15287 (2016-04-28)
    Open archived version from archive

  • Design for Clickability | In usability we trust
    underline text just to emphasize it Account for color blindness Don t forget that about 8 of the male population are color blind Having something more than just the color to distinguish links is therefor a good idea Not just text links The same thinking goes for other things that are clickable such as buttons checkboxes select lists images etc Make sure that these too actually look clickable For buttons that can mean to make them look like physical buttons with a 3D effect This makes them stand out from the page and look more like physical objects The button on the left could just as well be a banner or a header while the button on the right is begging to be clicked Provide clues Also make sure to provide other clues when the user moves the cursor over the object The cursor itself could for example change to a pointing hand which carries a strong affordance of clickability This happens by default over links in browsers but you could use a little CSS to create this effect on other clickable elements as well Another good idea is to make something happen with the clickable object itself when it s being hovered One common clue is to change the background color This is easily achieved with the hover pseudoclass in the CSS clickable item hover cursor pointer background color ff9 Accomodate for keyboard Some people prefer to use the keyboard instead of a mouse for one reason or the other Don t forget to take this into account when providing clues Links and form elements are easily reachable by keyboard by just tapping the tab key For the user to know which element currently has focus most browsers create a dotted outline around the element That s a pretty good affordance but you could make it even more clear An easy thing that I often do is to make it have the same style as on hover This is easily accomplished with CSS by using the focus pseudoselector clickable item hover clickable item focus cursor pointer background color ff9 Pro Tip If you don t like the dotted outline you can get rid of it by setting outline to none in the CSS Don t forget to design for touch On touch devices there are no such things as a hover It s therefor extra important to make clickable objects look clickable You will also want to make the click area bigger to accommodate for the fat finger syndrome but that s a topic for another article Fast facts Affordance The term Affordance was popularized by Donald Norman in his seminal book The Psychology of Everyday Things He later changed the term to Percieved Affordance since too many misunderstood what he meant by it Actually his latest term for this is Signifiers but that term hasn t gained much traction yet The Percieved Affordance is the properties of an object we understand by just looking at it For example

    Original URL path: http://www.svennerberg.com/2012/12/design-for-clickability/?replytocom=15288 (2016-04-28)
    Open archived version from archive

  • Agile | In usability we trust
    at Lean Tribe Gathering 12 the other day It was a nice event which included several great talks that inspired lots of interesting discussions In my talk named UX Agile I shared some of my experiences trying to incorporate UX work into an Agile environment Continue reading About me My name is Gabriel Svennerberg and I m a UX Designer Frontend Specialist and Author from Sweden More about me I

    Original URL path: http://www.svennerberg.com/tag/agile/ (2016-04-28)
    Open archived version from archive

  • Presentation | In usability we trust
    Agile I shared some of my experiences trying to incorporate UX work into an Agile environment Continue reading My slides from World Usability Day November 14 2011 Gabriel Svennerberg 0 Comments Here s my slides from my talk on World Usability Day The event gathered around 90 people and was held at Visma in Växjö Sweden I ve made the slides publicly available through SlideShare but please note that the

    Original URL path: http://www.svennerberg.com/tag/presentation/ (2016-04-28)
    Open archived version from archive

  • Code Crafting Blueprints | In usability we trust
    needed later can be placed further down After all we want the page to show something as fast as possible Continue reading Separation of Concerns November 7 2012 Gabriel Svennerberg 0 Comments Have you ever found yourself in a situation where you have a site where the HTML the CSS and the JavaScript are all tangled together and it becomes a nightmare to make even the tiniest site wide change

    Original URL path: http://www.svennerberg.com/tag/code-crafting-blueprints/ (2016-04-28)
    Open archived version from archive



  •