FLAT U.I. FUNCTIONALITY & USABILITY ANDRIEKA AUSTIN, BRANDI CALLUM, & BRITNEY WILLIAMS INFM 322

Size: px

Start display at page:

Download "FLAT U.I. FUNCTIONALITY & USABILITY ANDRIEKA AUSTIN, BRANDI CALLUM, & BRITNEY WILLIAMS INFM 322"

Marilyn Lane
6 years ago
Views:

1 FLAT U.I. FUNCTIONALITY & USABILITY ANDRIEKA AUSTIN, BRANDI CALLUM, & BRITNEY WILLIAMS INFM 322

2 There are many components of the internet that play an intricate role in our web experience. From the graphic user interface to functionality and usability, there are various things we anticipate a website to do in order to meet our needs and wants.

Web Design Elements A website s design is the first thing that a

In terms of the interface, design elements are used to portray an

3 Web Design Elements A website s design is the first thing that a user interacts with playing a large role in the first impression. In terms of the interface, design elements are used to portray an idea, market a business, sell a product, and be generally appealing to the user over all. A new trend in web design that is consistently growing in popularity is Flat User Interface, or Flat U.I.

4 Flat User Interface Flat user interface, or Flat U.I., is deemed more visually appealing opposed to its three dimensional counterparts. The major difference in these designs is the minimalistic attributes of Flat U.I. as it consists of flat pictures without a shadow to appear 3-d. Flat design is merely the embracement of the beauty and complementary increase in functionality of the design opposed to the disillusion of a three dimensional look that truly doesn t appear three dimensional anyway. It strips the visual elements down to a clear and engaging interface exposing a website s essential functionality.

user s web experience by removing excessive styling,

5 Flat U.I. According to Luke Clum, flat design is The perfect style for great UX or user experience. Considering the usability of a website, Flat U.I. enhances a user s web experience by removing excessive styling, therefore, attributing to swifter pages, cleaner code, and responsiveness. Smoothly incorporating ease of use and visual engagement, flat design is the perfect medium between graphical aesthetics, functionality and usability.

6 Functionality Usability.gov offered some really crucial information on the topic of questions to consider when designing of interaction and functionality Most Often when a website does not function, I quickly move on to what that does what I expect it to do. Is that what you want your clients to do? When I navigate the internet to find businesses to network with, I start with their websites. A BAD WEBSITE EXPERIENCE LOUD MUSIC DISTRACTING GRAPHICS LINK DID NOT WORK I FORGOT WHY I WAS THERE WITH A CLICK OF THE BOTTON YOUR VISITOR GOES TO A SITE THAT WORKS.

It is a key employee a Sales Rep A contact response rep A lead generator a feedback rep - a loan officer - an appointment maker It is a

7 FOR A REAL ESTATE BROKER FUNCTIONALITY MATTERS As a Real estate broker functionality is crucial to me as it makes my job much easier, and it helps my clients have a better home shopping experience. Thus, my website is my partner. It is a key employee a Sales Rep A contact response rep A lead generator a feedback rep - a loan officer - an appointment maker It is a tool storage system - an information system - a virtual agent - and a follow up agent. When my clients come to my website, they should be able to do all of the above with a click or two

QUESTIONS TO CONSIDER When designing your site.

uncomfortable, or if they feel there is a security risk.

What information do you provide to let a user know what will

What constraints can be put in place to minimize errors?

8 QUESTIONS TO CONSIDER When designing your site. What commands can a user use to cancel at any point they feel uncomfortable, or if they feel there is a security risk. How can they report their concerns? What information do you provide to let a user know what will happen before they perform an action? What constraints can be put in place to minimize errors? What feedback does a user get once an action is performed? Is this a secure site? How do I know where my confidential information is going?

9 Your website is symbolic of your professionalism Can we trust your site? If not, maybe we cant trust you? CONFIRM YOUR USERS ACTIONS! DON T LEAVE THEM HANGING AND WONDERING, WHERE DID MY PRIVATE INFORMATION GO. Provide a way to fix and correct errors quickly

10 Usability Step-by-step usability guide lays/maps out the necessary steps of 1) planning 2) analyzing 3) designing and 4) testing and refining the process.

Effective Usability starts off with a great development plan that helps identify the bottom-line project goals for your site, which might include simple things like: To reduce the number of phone

11 Effective Usability starts off with a great development plan that helps identify the bottom-line project goals for your site, which might include simple things like: To reduce the number of phone calls you or your organization receives (i.e. a place for the most frequently asked questions) Save a set amount of money (dollars) Reduce the amount of s (that can potentially be addressed by simply clicking a link to the site) Improve the customer experience (increase customer satisfaction) or, Increasing the number/amount of subscriptions to your online newsletter(s), etc.

12 As a final word of advice, each of these objectives should be established and well defined before the site is officially launched!

Discussion Questions? 1. Britney: http://uxmag.

UI instead of the used-to be three dimensional interface? 2. Brandi: I What is Functionality? and, What does the end user expect the website to do?

13 Discussion Questions? 1. Britney: Have you noticed the gradual change in websites, phones software (apps inclusive), and even television advertisements now incorporating flat UI instead of the used-to be three dimensional interface? 2. Brandi: I What is Functionality? and, What does the end user expect the website to do? PLEASE VISIT OUR BLOGS AJ {Andrieka J. Austin}: If a site is designed in Safari, does this affect how it looks on other browsers (internet explorer, fire fox, Google chrome, Mozilla, fire fox, etc.)--and, how can you check to be sure a site is "functional" for users of each of these browsers? Plus, what are some ideas for making a website or blog more interactive and increase it's usability?

14 References Clum, L. (2013, May 13). User Experience Basics. Retrieved January 15, 2015, from Develop a plan: Retrieved from:

Landing Page Optimization What is Split Testing?... 13

Landing Page Optimization What is Split Testing?... 13 Table of Contents Introduction... 4 Types of Landing Pages... 5 Elements of Successful Landing Pages... 8 Creating Stunning Landing Pages... 10 WordPress Themes & Plugins... 10 Templates & Systems... 11