Michael Gaigg: Über UI/UX Design

19Jul4

Job Posting: UX Designer & Visual Designer

Posted by Michael Gaigg

I'd like to forward two job postings by Sooriaraj Jeyaraman who is trying to fill two positions for the design team of the new Location Analytics initiative.

Feel free to submit your resume directly to Sooriaraj Jeyaraman. Thanks!

User Experience Designer

Overview / Job Description

Esri, the leader in geographic information systems (GIS) and mapping technology, is looking for an exceptional user experience designer.

Join a dynamic and energetic team working to bring Esri mapping and location analytics to the world of Business Analytics. Working alongside a focused team of product managers, developers and other user experience designers you will be responsible for setting new standards for the way users visualize their data on a map and perform analytics with maps.

The ideal candidate will be a practical-minded perfectionist who has the creative skills to grasp & simplify complex business processes through the creation of extremely intuitive user interfaces. While these are business systems, the user experience must be as easy and intuitive as the best consumer experiences.

You must be a natural collaborator who is used to develop designs in a team environment with multiple stakeholders. A passion for elegant design and incorporating new and innovative technologies is a must. Exceptional attention to detail and a good eye for aesthetics are crucial.

Requirements / Skills:

  • Strong, demonstrated understanding of User-centered design methodology
  • Experience in utilizing user research to drive design decisions
  • Solid skills in interaction design, user research, conceptual development, prototyping and usability testing
  • Experience in creating process flows, wireframes and mockups to effectively conceptualize and present detailed interaction behaviors
  • Experience in creating detailed user interface specifications
  • A strong working knowledge and experience in using tools such as Balsamiq, Axure, OmniGraffle, Photoshop/Illustrator, PowerPoint, Flash Catalyst at various design stages
  • Worked and designed Desktop, Web and Mobile applications & solutions
  • Experience with usability assessment techniques including usability heuristics, contextual enquiry and conducting lab-based usability testing
  • Worked in a cross functional team environment in an agile development process
  • Handled multiple projects at the same time
  • Experience collaborating and working closely with the UX team members.
  • Experience communicating effectively to the stakeholders
  • Experience in creatively solving complex problems within aggressive deadlines
  • A portfolio demonstrating past work experience and relevant User-Centered Design solutions

Experience:

  • A Master’s degree in Human Factors, Human Computer Interaction, Usability Engineering, Cognitive Psychology or such related field
  • Minimum two years of work experience in user experience design

Visual Designer

Overview / Job Description

Esri, the leader in geographic information systems (GIS) and mapping technology, is looking for an exceptional visual designer.

Join a dynamic and energetic team working to bring Esri mapping and location analytics to the world of Business Analytics. Working alongside a focused team of product managers, developers and other user experience designers you will be responsible for setting new standards for the way users visualize their data on a map and perform analytics with maps.

The ideal candidate will be a practical-minded perfectionist who has the creative skills to grasp & simplify complex business processes through the creation of extremely intuitive user interfaces and engaging visual and motion designs. While these are business systems, the user experience must be as easy and intuitive as the best consumer experiences.

You must be a natural collaborator who is used to develop designs in a team environment with multiple stakeholders. A passion for elegant design and incorporating new and innovative technologies is a must. Exceptional attention to detail and a good eye for aesthetics are crucial.

Requirements / Skills:

  • Strong, demonstrated understanding of User-centered design methodology
  • Experience in utilizing user research to drive design decisions
  • Exceptional skills in Photoshop, Illustrator and other layout and design tools.
  • Knowledge and experience using animation software such as Flash and/or After Effects
  • Good general understanding of web and mobile platforms and experience producing designs and assets for them
  • Excellent understanding of general design principles and practices
  • Ability to create balanced, well formed layouts in print and interactive projects
  • Strong background in typography and color theory
  • Familiarity and facility with icon creation and icon systems
  • Top-notch communication skills
  • Efficient time management
  • Strong design portfolio that shows great potential

Experience:

  • Bachelor's degree in graphic design, web development or an equivalent combination of education and experience
  • 1-2 years experience in professional interactive design capacity
18Jul5

Create your own Treasure Map

Posted by Michael Gaigg

Historical Style

Historical Style

Now this is cool (thx Nick for sharing)! An antique looking basemap (by MapBox), just missing pirates, treasures, hidden islands and tales about monsters of the sea...

Update (thx to Aileen Buckley): Esri has "a style you can use to do this -- it is the Historical style on Mapping Center -- it has ships, sea serpents, etc... (thanks to Jaynya!)".

Download: create historical looking maps (scroll down to 'historical' style)

10Jul3

Lifespan is an important Design Decision

Posted by Michael Gaigg

Mayan mahem

Mayan mahem

The lifespan of a planned application or website is an important (and often overlooked) requirements influencer. Many questions come to mind that appear to be technical in nature but have to be understood by the designer to optimize their design decisions on capabilities and known limitations of the target technology. Designs can never truly be technology agnostic and in my opinion if they are, then this fact will create gaps between design and implementation later on. So you better be aware of them.

Typical Questions to ask:

  • Will the app be likely be superseded by something else within the next 6 months?
  • Is another known technology catching up and soon more prominent than our current target technology?
  • Do we rely on third-party tools/plugins that need to be maintained or maybe will render our application unmaintainable?

Especially the last question bares high risk of failure. If you rely on a JavaScript's front-end framework - like we all do - say, jQuery UI, chances are that our designs will a) be limited and b) sometime be stuck in the middle once a major redesign hits us. If the redesign happens before the end of the planned/anticipated lifespan of our app, cost and effort to upgrade might not be feasible and thus we cannot upgrade to the latest versions anymore. The End.

Scalability

Amount for various cases where your design needs to be flexible enough to handle changes over time. These can include:

  • Administration: more objects (users, items) are added over time. Does the app provide pagination? Search? How easy can they be plugged in?
  • Load: processing times increase. How will the system display delays in page refreshes? Download times?
  • Client requests: more functionality needs to be added. Is the design flexible enough to accommodate another button or menu item? Etc.
  • i18n: multi-language support needed? Now? Later? Maybe?
  • Accessibility: is it worth the effort?
  • Support for MVP (minimal viable product) and incremental improvements?

In many ways the Maya calendar and it's associated 2012 phenomenon are a good example for design decisions based on lifespan. Who cared back then that after 5125 years the calendar would need to be reset (or cannot handle more combinations), like many software systems didn't take into consideration what is now known as the Y2K or Millennium bug which was caused by the practice of abbreviating a four-digit year to two digits for pure storage consideration, which nowadays in our abundance world of storage is really hard to follow. But hey, it costed an estimated remediatioin of $416.- in today's currency world-wide.

Lesson

Take into consideration the lifespan of your app when designing it. Any negligence is careless design and may result in increased cost or even an unmaintainable or unusable product later on.

What are your experiences with lifespan?

8May27

Mapping Stereotypes: Europe according to Americans

Posted by Michael Gaigg

Europe According to USA

Europe According to USA

...and other stereotypes by Yanko Tsvetkov (thx to Rob for pointing me to this site)!

Working under the pseudonym "alphadesigner" which (according to him) makes people usually think that his work is really important. Regardless... Yanko hits the nail right on its head when it comes to stereotypes.

You gotta love the European map as seen by different states/cultures. And if you really think that everybody in Austria eats Apfelkuchen for breakfast and Italy is infested by Godfathers... then you either watch too many movies or ...are American LOL.

29Apr42

Amazing Paintings with inlaid Maps

Posted by Michael Gaigg

Patriarch (original), 2006 Inlaid maps on panel

Patriarch (original), 2006 Inlaid maps on panel

What an amazing find (once again thx to Nick Furness).

Matthew Cusick created these astounding paintings and collages using inlaid maps.

I love map art (does this word exist already?) - do you guys know more? Send it to me and I'll post it here, can't wait for maps to enter urban culture, maybe some map graffiti or street map painting on a sidewalk...?! ;)

4Apr30

Multiline TextBox control (TextArea) in Silverlight

Posted by Michael Gaigg

This is one of those things that can drive you crazy. There is no 'TEXTAREA' equivalent in Silverlight. One needs to use the TextBox control with some tweaks instead. I'm terrible in remembering details like these, so here for my records:

<TextBox TextWrapping="Wrap" Width="300" Height="80" AcceptsReturn="True" HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto" />

Some remarks:

  • TextWrapping=True will make sure that any text entered will actually wrap to the next line
  • Height is important
  • AcceptsReturn is useful to avoid accidental submission of the form
  • Horizontal and Vertical scrollbars are set to "auto", but feel free to set to "Visible" if that's your preference

Enjoy!

27Mar7

Esri’s First Homepage – Esri.com Anno 1994

Posted by Michael Gaigg

Esri.com anno 1994

Esri.com anno 1994

Today I have a special treat for you, an awesome piece of Esri's history (thx Jayson for pointing this out to me):

1994 - www.esri.com launched

Gotta love this!

Reminds me of my first homepage made in 1993, unfortunately I don't have any screenshots or code anymore (one of my biggest regrets). All I remember is that I used frames, lots of beveled buttons an an animated GIF for the email link.

Can't believe how far we've come in only 20 years.

19Mar26

The 4 Questions of Strategy

Posted by Michael Gaigg

4 steps of strategy

Just described 'strategy' to a consultant and thought to share my awesome whiteboard drawing ;)

The 4 questions of defining strategy are:

  1. Where am I now?
  2. Where do I want to go?
  3. How do I get there?
  4. How do I define success?

The success criteria is crucial. It's the metric for any decision you need to take along the way, it will help you determine which design is 'better'.

13Mar4

Proposing: Feature Spotlight

Posted by Michael Gaigg

Feature Spotlight

Feature Spotlight

Let's say you want to highlight a feature on the map, e.g. a user has searched for a landmark, typically one would place a marker on the map and zoom to that location. The downside is that the user still needs to 'search' for the visual clue (the marker) on the map.

I think the missing link here is to 'black out' the whole map and only highlighting the area surrounding the landmark. This provides a natural focus on the feature and is a really elegant alternative I believe.

Optionally one could use the modal area to add a description or even photos (get creative for yourself). And yes, leave the marker also for browsers that don't support CSS3.

The code is as simple as could be, here is the CSS class called 'spotlight':

    .spotlight {
        display: block;
        position: absolute;
        top: 0px;
        left: 0px;
        width: 100%;
        height: 100%;
	z-index: 100;
        border: 0;
        pointer-events: none;
        /* this is the sweet spot */
        background-image: -webkit-gradient(radial, 50% 50%, 0, 50% 50%, 100, from(rgba(0,0,0,0)), to (rgba(0,0,0,0.8)), color-stop(0.8, rgba(0,0,0,0)));
        background-image: -moz-radial-gradient(50% 50% 45deg,circle closest-side,transparent 0,transparent 100px,rgba(0, 0, 0, 0.8) 120px);
    }

And here the HTML defining the spotlight container:

<span id="spot" class="spotlight"></span>

Implementation inspired by CSS3 Spotlight.

10Mar30

Amazing: National Geographic World Map by Esri

Posted by Michael Gaigg

Yes, I'd rather be skiing in the Austrian Alps as well... ;) Amazing map!!


View Larger Map

This map is designed to be used as a general reference map for informational and educational purposes as well as a basemap by GIS professionals and other users for creating web maps and web mapping applications.

The map was developed by National Geographic and Esri and reflects the distinctive National Geographic cartographic style in a multi-scale reference map of the world. The map was authored using data from a variety of leading data providers, including DeLorme, NAVTEQ, UNEP-WCMC, NASA, ESA, USGS, and others.

Link to map contents on ArcGIS online: National Geographic World Map

Page 4 of 23« First...23456...1020...Last »