It’s said that “UI design is the most vital component of web development” (Garcia). LiveTiles is dedicated to providing excellence in UI at every step of the process. From design to implementation, you’ll find tiles to make the right statement. But what exactly is great UI? Think of it this way, “In web design, great user interface, or UI design, is all about helping the user to accomplish a given task as simply and efficiently as possible.” (Carson). For example, our intranet can be viewed below:
The first thing you’ll notice is the amount of whitespace. There’s a good design reason for that, since “not adding proper whitespace into UI design makes the layout of the site incomprehensible for your site visitors” (Garcia). The site has few colors, but those that are there stand out. Some designers describe the current trend to use bright “80’s colors.”
UI design includes color and font selection, among other considerations. The key takeaway is not to get distracted and provide a simple and clean UX. We’re delivering performance for the user, “While the look and feel is undeniably important, at the core of a great UI is function” (Carson). The LiveTiles homepage gives us a quick and easy way to check in with our various divisions. We can jump into product information, check in with one of our internal teams or access HR paperwork at a glance.
From a design standpoint, we use configurations for opening links in modal dialogs. This is something anyone can do. When you add a document tile to the page and access its configuration, under the links tab the title link target property appears. When you select “slide,” a set of options are available. Options include a width (in pixels) configuration, and a left or right side configuration (which slides in from the left or the right of the window). LiveTiles Software Developer Trey Miller points out that if the title link target setting is “modal,” another variety of settings opens. A frameless dialog is possible, along with the framed and SharePoint-native dialogs. The native SharePoint dialog is useful for any native SharePoint views and pages. The native SharePoint dialog will render the SharePoint page as in a modal, removing the header bar and side navigation.
Slider tiles are a great feature for keeping page clutter to a minimum and maintaining that sleek page look. A slider tile allows you to manage your site more efficiently; the tile is only there when the user needs it. This video explains how to use a slider tile.
One of the top digital trends for 2016 involves people building on “the desire to embed more feeling and emotion into digital communications” (Freidlein). There are also increasingly sophisticated programs that interact with users, think Apple’s Siri. We’re already reacting to emotion-inducing technology in places we may not expect. Something that is visually simple, “An impeccably designed UI, has the ability to evoke an emotional response” (Garcia).
What exactly are we responding to in a UI? There are digital tools like emoji’s and Giphies, and color strategies that make this connection more human. Giphies are one of the newer digital trends, which are appearing everywhere. To learn how to embed a Giphy into your site you can read this how-to article.
As I mentioned earlier, color is an important factor in our work and our UX and UI expert, Fred Showell, likes to keep the colors to a minimum. To select those colors, think of your audience and the message you are trying to convey, “As is the case with everything in web design, make sure you thoroughly understand your users” (Cao). Your user preferences will determine your design choices. A great resource for color was discovered by LiveTiles Director and Co-founder Peter Nguyen Brown at https://colorlisa.com/. Another remarkable color resource is available at Tin Eye https://labs.tineye.com/multicolr/. For a catalogue of good icons, our developers are all big fans of Font Awesome: https://fontawesome.io/.
LiveTiles, in partnership with Microsoft’s Office 365 suite and SharePoint, is bringing the features you’ll need for collaboration, teamwork, intranets, and project management tools to your canvas. With digital design strategies from our team, your digital workplace can increase employee engagement and amplify your UX.
1. Cao, Jerry. “5 UX Best Practices For A Stunning Website.” The Next Web 13 December 2015. Web. 14 July 2016.
2. Carson, Nick. “11 Great UI Designs.” CB Creative Bloq 17 September 2014. Web. 13 July 2016.
3. Freidlein, Ashley. “Digital Trends For 2016.” Marketing Week 12 Jan 2016. Web. 14 July 2016.
4. Garcia, Ava “The Importance of Visual Consistency in UI Design.” UX Passion