Four UX Design Artifacts That Will Help You Win Design Challenges

User Experience Design as a discipline tells us that there is an ecosystem of elements that work together to create delightful experiences for users. Like the universe, it is in constant growth, frequently producing elements and specialties to integrate into the design process to create these experiences for users, such as information architecture, interaction design, user research, copywriting, visual design, and many others.

Since the scope of user design is massively huge, let’s focus on user experience for digital experiences (websites, mobile, etc) and how something called design artifact can help you improve your performance in Topcoder design challenges.

MY TV IS ALSO AN ARTIFACT

That’s right, by anthropological definition, an artifact can be an object or form of evidence that provides cultural or historical value. In UX design, it’s safe to say that a design artifact is the product of documentation generated through the practices of the discipline. As mentioned earlier, there are roles we can play within a UX design project. Throughout the iteration process, they produce information that can definitely be recognized as design artifacts. Let’s use wireframes as a quick example: they hold historical information since we can iterate on them at any given time, save comments, create new versions, new comments, and have them available for historical reference. Among the most common design artifacts, we can find user research reports, personas, wireframes, storyboards, user journey, sitemap, task flow, prototype, usability testing, and others.

Among those, which of them add value to my design solution? My proud designer ego will say all of them. But for Topcoder challenges, my opinion has to be different. It’s a known fact that we can not apply a full UX project onboarding strategy to a design problem because of the business model for challenges, especially because of the way iterations and communications happen. However, my experience tells me some of these artifacts can be wisely used to improve our understanding of the problem, unveiling details that our opponents may not be able to see or feel. Therefore, using them has an advantage. I invite you now to take a look at the artifacts mentioned below. Enjoy.

1. PERSONA

Personas are documents: plain, simple documents that describe the target user or the actors (persons) you are designing for. The outcome of this document will help you get a clear understanding of the actor’s behavior during the experience, which will lead you to finding pain points (frustrations), satisfaction (likes) and general needs.

Very well curated persona example. Dribbble | Arthur Chayka.

For a Topcoder design competition scenario, I’d create a persona on paper for speed purposes. The challenge requirements (spec) can give us hints of what information we can use to assemble our persona document. If there’s not enough information then we have work to do in the forums by asking questions about our user. We need to know at least:

• What are the user goals?

• What are her frustrations?

• What does she like (within the proper context)?

• What’s the most difficult challenge for the user?

• What are her priorities when using the product?

Go ask in the forums, the challenge copilot and client will thank you for those questions. Just try it and see the results.

2. SITEMAP

Sitemaps help to identify a site or application hierarchy, to set connections among the components that are part of the system. There exists a formal nomenclature and rules for creating site maps, you can easily find them online.


Caption: Dribbble | Marko Đurić.

I’d suggest using a sitemap for the following purposes:

• Understand the elements that interact with the application.

• Have a better picture of how to link workflows and transitions.

• Create a solid navigation system.

3. WIREFRAMES

A wireframe contains what would be the visual representation of the functional behaviors of an application. Content and navigation structures would also be laid out. If you previously had a sitemap then wireframes become easier to visualize. In my opinion, either high or low fidelity, they can help to solve many issues before jumping to create our design on the computer, so I’d definitely use them as part of my artifacts toolset. There are even specialized competitions solely dedicated to creating wireframes (see how to profit from sketching in challenges, a light-weight approach). Why would we create one then?

Mobile screen for a social application.

Most of the challenges are not that lucky (or unlucky?) to provide wireframes, which is the physical representation of a mental model that really helps to understand what’s going on in the user interface. For my particular preference, considering time constraints of a challenge, I’d take the paper and pen approach to create my wireframes. Sketching on paper is fast, convenient and helpful.

4. USABILITY TESTING

Testing is another mini-universe within UX Design. There are many books written about how to approach usability testing, different techniques, and methods to test and validate your concept.

Observing failure was never more important.

For that, you would need a product to test and decide which stage is the most appropriate to run the test. Is it at the beginning of the challenge? Should we test our wireframes? Considering the typical timeline constraints of a challenge, I would focus on the end, once the design is ready. I’d suggest creating your high-fi prototype using your designed solution and kindly asking a friend or close person to try the application. Simplified, this is what it would look like:

• Create a testing case (set of tasks the user has to perform).

• Watch or record user actions, behaviors, successes and failures.

• Take notes on what they had trouble achieving.

• Reiterate the problem, make adjustments where necessary, test again.

If I had to choose one thing to know about usability testing that would be the power it grants you. It shows you a perspective of the user patterns, satisfaction and error scenarios during the experience execution, giving you the ability to foresee mistakes in your design. I guess it sounds better fixing errors before submitting rather than after the competition is over, right? Test, fail and fix!

Before you close your eyes tonight, it’s essential to be sensitive about the user’s wants and needs. Placing her at the core of your planning through the experience workflow is a tenet for UX design practicers. Be ready to sleep like a baby knowing that you improved your design workflow and your outcome performance in Topcoder challenges.