Go Premium for a chance to win a PS4. Enter to Win

x

UI/UX

79

Solutions

185

Contributors

UI stands for User Interface and UX for User Experience. While there are key differences between the two, both concern the design of how humans interact with computer systems and software.

Share tech news, updates, or what's on your mind.

Sign up to Post

Geo-targeting is the practice of distributing content based on a person’s location, as best as you can determine it. Let’s look at some ways you could successfully use this tactic. The following tips and case studies could lead to meaningful results.
1
Industry Leaders: We Want Your Opinion!
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

This article intends to explain why UX (User Experience) sessions between UX teams, product managers and engineering teams don't end up with any value to the product despite everyone's best intentions.
1
Technology teams care about budget, time limits and iterative production, that’s why product designers should be politicians and act fare.
8
Windows Phone Theme Colours
The Windows Phone Theme Colours is a tight, powerful, and well balanced palette. This tiny Access application makes it a snap to select and pick a value. And it doubles as an intro to implementing WithEvents, one of Access' hidden gems.
3
 

Expert Comment

by:John Clark
Comment Utility
Gustav,

I adapted my application to this and I could not believe how efficient and easy this was to do. I see myself deleting a HUGE amount of redundant code and using Class Module in the future. They have always intimidated me and quite frankly, I did not see the use of them until I needed something similar to what you did here. The link you provided to John Colby's Blog was spot-on and VERY informative.

A question on this method however, the particular functionality I am trying to achieve applies to Text and Combo boxes. Reading JC's Blog led me to believe that I would need another Class to handle each type of Object.

Did I comprehend that correctly or can I include more than one Object in this Class?

Great stuff!

John
0
 
LVL 52

Author Comment

by:Gustav Brock
Comment Utility
Yes, you implement many classes, perhaps one for each type of control.

Or you can modify this check:

    If Control.ControlType = acTextBox Then

to check for other control types as well. And then either apply the same or different methods.

Or do both. Or add more conditions; for example only apply a method to a control with a control source.

/gustav
0
Color can increase conversions, create feelings of warmth or even incite people to get behind a cause. If you want your website to really impact site visitors, then it is vital to consider the impact color has on them.
1
How do we balance the user experience (UX) with reasonable security measures? It can be done, if you keep these fundamentals in mind.
0
Because your company can’t afford for you to make SEO mistakes, you’ll want to ensure you’re taking the right steps each and every time you post a new piece of content. This list of optimization do’s and don’ts can help you become an SEO wizard.
3
 
LVL 17

Expert Comment

by:Kyle Santos
Comment Utility
Nailed it.

This is a great article.  The proof is in the pudding as they say. :)

Screenshot_1.png
1
If you don’t want your company's site to fail on the web, you’d do well to observe these best web design practices and make sure you implement them when applicable.
0
An enjoyable and seamless user experience can go a long way on an eCommerce site. While a cohesive layout and engaging copy play roles in creating a positive user experience, some sites neglect aspects that seem marginal but in actuality prove very pivotal in lead conversion.
2
If you’re trying to turn your small- to medium-sized business website into something great, then look to some of the strategies being used by similarly sized businesses for inspiration.
0
Concerto Cloud for Software Providers & ISVs
LVL 5
Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

Any business that wants to seriously grow needs to keep the needs and desires of an international audience of their websites in mind. Making a website friendly to international users isn’t prohibitively expensive and can provide an incredible return on investment if handled right.
0
Although it can be difficult to imagine, someday your child will have a career of his or her own. He or she will likely start a family, buy a home and start having their own children.

So, while being a kid is still extremely important, it’s also important for you, as the parent, to start thinking about your child’s future. For many of us, that means investing in a college fund — but that’s hardly the end of it.

What many of us don’t do is truly prepare our child for the working world. It’s not until middle school or high school that we really start discussing the idea of going to college. Maybe we need to start a little earlier than that?

I’m not suggesting you should choose a career for your child. But you should be able to identify certain skills and characteristics that would make them a suitable candidate in various types of industries, such as a future developer or UX designer. You can nurture that skill set early on, and prepare him or her for a potential career in one of those fields.
 

Invest in Future Developers and UX Designers


To make this simpler, I’ll merge these two career paths into one.

Computer scientists drive the technological infrastructure of our world. They develop and create new hardware, software, applications and even methods for using technology. Many opportunities like software engineers, mobile application developers, game developers and even UX designers fit into this broad field.

Why does this matter? Well, since …
1
Login Failure
It’s a strangely common occurrence that when you send someone their login details for a system, they can’t get in. This article will help you understand why it happens, and what you can do about it.
1
Comunicación con notas
"In order to have an organized way for empathy mapping, we rely on a psychological model and trying to model it in a simple way, so we will split the board to three section for each persona and a scenario and try to see what those personas would Do, Think and Feel, when they are in that scenario."
4
I've been asked to discuss some of the UX activities that I'm using with my team. Here I will share some details about how we approach UX projects.
2
Elizabeth Sanders (2002) believes there is a shift happening in design that generated an attitude to think about designing with users instead of designing for users (Sanders, 2002). Everyone has something to add on top of the main idea in a design process, so why should they be ignored? She also stated If they can have appropriate toolkits to express their ideas, they can share their thoughts and ideas in a creative process. However, it should be considered that these participants are not part of the team, but they speak for the research and share their insights.

It is also believed that, it is hard to design experience, because it is a step-by-step creative activity and users will produce it. This process has two sides, communicator and communicate, it is important to see how these two are interacting in a certain moment. The question here is how this communication can be understood and how they can be collected in a sort of valuable conversation, which can create positive effects during the design process in order to design a meaningful experience? To summarize, how do we access experience?

Access to Experience

Elizabeth Sanders (2002) in her all encompassing research about user-centered process and co-design has proposed sort of rules in order to collect users’ current experience and their preferred experience. She believes designers can listen to what people say, and catch what they think. Designers also can watch what people do
4
In order to bring contextual and meaningful factors into a design task (Kouprie & Visser, 2009) designers should try to be close to the lives, feelings, and experiences of users to design in the way that meets users’ needs (Koskinen et al., 2003). Empathy can be counted as one of the most important attributes of the design process in a human centric project. Both designers' and users' minds help each other to reveal the exact feelings about the user who uses that specific product. For example, designers might spend a lot of time with users with disabilities to design wheelchairs for them; they may need to feel the same pain that disabled people feel to see what issues a disabled person has with an automatic wheelchair.

There have been many studies about empathic design and all of them argue that empathy is a significant quality in the process of product development that helps designers to meet customer needs (Mattelmäki & Battarbee, 2002, Suri, 2003). Empathic design supports a wide range of issues in design from rational issues to private contexts (Mattelmäki & Battarbee, 2002).

Approaches to Design with Empathy

There are several techniques for empathy in design; however, Kouprie and Visser (2009) try to categorize them into three main categories that will be presented here.

First of all, the most popular and accepted approach is being in direct contact with users (McDonagh & Bruseberg, 2000, Mattelmäki & Battarbee, 2002, Suri, 2003). Some advocates…
3
Wireframe design, a tool for being more creative!

When information, interface, and navigation are being designed, page concept comes up to create a unified skeleton for a website. Garrett (2010) says: “the page layout must incorporate all the various navigation systems, each designed to convey a different view of the architecture” (Garret, 2010, p. 128); all of these pieces are necessary because they have a role in the page. Therefore, information design is crucial for a good result in this part.

A wireframe can be defined as schematic way to create the skeleton of a website that shows how all elements can be fit together to communicate with users (Garrett, 2010). Wireframes collect all ideas in a single document and in the process of working on a web project it is an important reference for the implementation of visual design (Garrett, 2010).

Wireframes are the first phase in a formal visual design for a web project (Garrett, 2010), and in the whole process of development, the developers must be able to come back and compare the product with what has been defined in the wireframe. A wireframe should be a tool for builders of a website to check if they are progressing correctly.

Garrett also believes that when there are separate visual designers and user experience designers in a project, the wireframe enables both sides to share their comments and ideas on a specific topic. It also helps them find hidden questions, apart from its utility in uncovering …
2
Design solutions come from a creative mind.

It is not necessary to involve a lot of expert creative designers in each design process. It is important to catch creative insights of participants in a design issue -- users and owners -- in an exact moment which that creative momentum is happening (Dorst & Cross 2001).

Dorst and Cross in their research also mention that designers must be able to collect all of these insights during the process in order to come up with key features of the design concept. However, it is not guaranteed that the expected creative moment should happen for sure because it is related to the situation that the design process being done.

In participatory design one of the items that affects the creative process is the tool for participatory design (Sanders, 2002). Sanders belives that using "make tools" is a projective way for participants in any level of design ability to express what they want and what they have in mind. In other words, it can be a language in common for all stakeholders in a design project.

For example, people can use LEGO pieces to make product in a simplest way, but in the meantime they are talking about those features that they want. That is how that LEGO playing enables them to talk more and more about their needs. In a nutshell, this activity enables them to say, do and make their dreams.

Christiaans (1992) shows that time is an important issue in creative process. If participants spend more time to map ideas from …
5
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE
LVL 5
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

McNamara and Kirakowski have published several articles regarding the process of evaluating for user experience. Literature in this area shows that Functionality, Usability, and Experience are the main three aspects of using a product that need to be considered when designing and evaluating technology (McNamara & Kirakowski, 2006).

In their research they argued that functionality is a technical issue and directly in contact with the product (McNamara & Kirakowski, 2006). So an evaluator tries to find out that what the product exactly does.

Usability measures the interaction between users and a product. The product should solve an issue for users, so obviously it should be completely user-oriented and satisfy user needs. Usability attempts to give users the opportunity to see if the product acts exactly like what they really need.

User experience covers the wider area of the connection and interaction of the user with the product to see if it really fits with users’ nature (McNamara & Kirakowski, 2006). According to the literature, questions might include “how the person felt about the experience, what it meant to them, whether it was important to them, and whether it sat comfortably with their other values and goals.” (McCarthy & Wright, 2005, McCarthy & Wright, 2004).

In order to measure and evaluate each aspect, the study suggests valuable points that need to be considered when the assessment is being done. Guidelines for all these three parts is …
4
Marc Hassenzahl believes “user experience (UX) is a strange phenomenon” (Hassenzahl & Tractinsky, 2006, p. 91). He also says user experience supports all aspects of the interaction of the user with the whole product and services around it (Hassenzahl, 2006). In another discussion the concept of user experience is associated with a wide variety of meanings (Forlizzi & Battarbee, 2004) from beautiful to hedonic and the functional features of a product (Hassenzahl, 2006).

Hassenzahl (2008), in another article about UX, says: “User Experience (UX) is not just old wine in new bottles” (Hassenzahl, 2008). It tries to widen the horizon of interactive technology in a high quality way, and also tries to have a closer connection to humans in order to create a good experience around a product (Hassenzahl, 2008). Regarding this description, Hassenzahl added a definition; he believes a “Good UX” is the consequence of fulfilling the human needs for autonomy, competency, stimulation, relatedness, and popularity besides being in touch with the product or service.

In another research paper he calls these features hedonic qualities of a product (Hassenzahl, 2005). On the other hand, pragmatic quality will be mentioned. They should facilitate the way that a product can achieve its own functional goals. He puts hedonic quality against pragmatic quality and in another article uses these two qualities to describe a model of user experience.

Hassenzahl (2005) proposes a model for user …
8
Have you ever wanted to create graphical elements directly in inDesign? This tutorial will teach you how to have an image bound within text using the pathfinder tool in inDesign CS6. This technique will help decrease the amount of time spent opening other applications, creating and editing files, saving files, closing the program, and finally placing the element on the page giving you the same end result.

Instead of the text having a font color, the image will fill the area. First, open the application. Choose to create a new document. Feel free to use any settings you prefer. I decided to go with a half letter in a landscape orientation. Click OK.

Once the document has loaded follow the steps below:
 
  1. Select the rectangle frame tool. Click anywhere on the document and drag (while still holding down the click) to the size you desire. The image will be placed inside this frame.rectangle-tool.png
  2. Now it is time to place the image within the rectangle frame. While the frame is still selected, go to  File > Place. Find and select the image you would like to be the background of your text.place-image.png
  3. If your image is larger than the rectangle frame and you would like to reposition, use the selection tool to double click the rectangle frame. A brown bordered box will appear around the entire image. Rearrange and resize for desired look. Click anywhere on the page to escape the brown bordered box.
  4. Next, select the
0

Introduction

In this tutorial, I'll explain how to create an animated progress meter in a wireframe prototype developed using Axure RP 7.0 - a leading prototyping tool for designing web sites and software. (For more information about Axure and getting started with it, check out: http://www.experts-exchange.com/Web_Development/Software/A_17344-Setting-Up-Basic-Interactions-in-Axure.html)

Here's a sneak preview of what you'll be building:

axureTutorial-done2.png
Please note that this tutorial does require the use of Axure 7.0 or later, which introduced the "Set Panel Size" action that the method used here relies upon.
 

Part 1: Creating the Basic Wireframe


1.) Add a rectangle to the page and resize it to be the full shape of the progress bar. This will act as the outline of the meter. (Take note of the width of this rectangle, you'll need to know it later on. I set mine to 400 pixels.)
axureTutorial-1-1.png
Protip: I highly recommend giving descriptive names to all the objects you create in any Axure prototype. While it doesn't matter much in a page with very few objects, these things quickly pile up and when you're setting up actions, figuring out which object in your list to perform the action on is really difficult if nothing has a label! You do this by entering a value in the Name field of the Widget Interactions and Notes pane for each object.

2.) Duplicate the rectangle created in Step 1, but give it a color fill. This rectangle will act as the filled-in portion of the progress bar.
axureTutorial-1-2.png
3.)
5
 
LVL 66

Expert Comment

by:Jim Horn
Comment Utility
Very nicely illustrated.  Voting Yes.
0
 
LVL 7

Author Comment

by:Brian Matis
Comment Utility
Thanks, Jim! Glad you like it :-)
0
When designing and editing page layouts in inDesign, fonts can become messy without the help of paragraph styles. How many times have you re-read through a document you created and noticed a sentence in the middle of a paragraph happened to be a different font-size? How much time have you wasted scanning a ten page document adjusting styles manually? Paragraph styles can help speed up the process of editing font styles and decrease the amount of display errors in your document. In this tutorial I will go over the basics of paragraph styles in inDesign CS6 to hopefully help your future page layout projects.
 
  1. First, open the inDesign CS6 application. Once it has launched, select document under Create New.Create-New-Document.png
  2. A new document window will appear, for this tutorial edit a one 8.5 X 11in page with 1in margins and no bleed. Click OK.New-Document.png
  3. Once the document has loaded, put some filler text on the page using the type tool. To do this, select the type tool on the right toolbar. Click anywhere on the document, drag to the desired width and release to create a text box. For this tutorial make sure to include a header, subheader, paragraph, quote, and a caption. If you do not want to write content, right-click the text box and select Fill with Placeholder Text. I went ahead and did this for my paragraph, quote, and caption sections. Filler-Text.png
  4. If you are working in the Typography workspace find the paragraph styles panel in the right toolbar. If you do not see it go to Window > Styles > Paragraph Styles.Right-column.pngWindow.png
0
“You cannot NOT have a user experience” - Lou Carbone
 

User experience (UX) in the past has been an underrated subject of discussion. It has existed since the late 19th century during the machine age. According to Where UX Comes From, an article from uxbooth.com, user experience was conceptualized when labor activities became more efficient. The observation of workers becoming more effective with their tools was the precursor to the UX concept. The machine age philosophy pioneered ways for labor to be more productive and routinized by “pushing the boundaries of what human labor could make possible.” Because of this people began to understand the importance of user experience. The more efficient, the more profitable. The next major leap was in the early-mid 20th century, when ergonomics emerged. Ergonomics motivated people to focus on the “design of equipment and devices to best align with human capabilities.” It made logical sense to design a product based off of the ease it was for someone to interact with it.
 

Over time as user experience adapted and was discovered, a definition was formed. According to the Nielsen Norman Group, user experience "encompasses all aspects of the end-user's interaction with the company, its services, and its products” (www.nngroup.com).

It is essential to understand how a user interacts with a device or product, and how design strategies can heavily influence that interaction. When coming up …
3
 
LVL 7

Expert Comment

by:Brian Matis
Comment Utility
@Ali - Thanks for the recommendation! I've actually got a copy of it on my shelf, but haven't gotten to it yet. Definitely need to move it up in my priority stack now though, since you've specifically recommended it :-)
0
 
LVL 6

Expert Comment

by:Ali Eslamifar
Comment Utility
@Brian
Thank you ;) I really like that book, that helped me a lot in my education.
0

UI/UX

79

Solutions

185

Contributors

UI stands for User Interface and UX for User Experience. While there are key differences between the two, both concern the design of how humans interact with computer systems and software.