Adesiyan Report on GUI effectiveness

Running head: EVALUATING SMARTBUILDER 0
Evaluating the HCI Quality of SmartBuilder and the Effectiveness of Its Argument
Jelilat Adesiyan
University of Houston-Downtown
Abstract
This report evaluates SmartBuilder’s HCI quality as well as well as the effectiveness of its
argument. Using software design and HCI, the interface designers created a web WYSIWYG
(what you see is what you get) application in an attempt to persuade instructional designers and
project managers (the audience) to use the application above others. Should the argument be
successful? Below is the attempt to analyze the web application for its argument as well as the
quality of the HCI in order to answer that question. In order to evaluate the Quality of HCI I used
the following criteria; Visual/ Selective attention capability, Stimuli to response compatibility,
Help Indication/Information availability, Feedback Loop, Familiarity/ Appeal to convention,
Accessibility, Interactivity, Negative/Positive goal congruency, Input technology/Browser
compatibility, Attractiveness/ Unity of Graphics & Color, and Appeal to user’s knowledge. In
addition to the HCI quality criteria, I used the following criteria to evaluate the software’s
argument; credibility, learnability, repetition, intuitiveness and pricing.

EVALUATING SMARTBUILDER 1
Introduction
The application that will be analyzed today is the web software application SmartBuilder,
version 3.14. It has previously been used to create a lesson titled “how to create a multi-page
template”. Ultimately, the purpose of this report is to evaluate the software's argument and
whether it can be successful in persuading the audience to "purchase and/or use the software,
give good reviews about it to others, and in some cases contribute to its development or support"
(Bjork). Ultimately, in order to evaluate the success or failure of the software's argument from a
technical communicator’s perspective, in addition to other qualities, the quality of the HCI must
be evaluated. HCI software developers have a hand in every software application that is created
today. As Jacko (2012) writes “HCI software developers contributed innovative tools that
enabled programmers and nonprogrammers to create interfaces for widely varying applications
and diverse users. HCI professionals developed design principles, guidelines, and sometimes
standards dealing with consistency, informative feedback, error prevention, shortcuts for experts,
and user control” (p. xv). As technical communicators, the evaluation of the quality of HCI is
important overall to the success of a tool and how the user perceives it.
SmartBuilder is an e-learning authoring tool. According to SmartBuilder's marketing
blurb, it is "an e-learning tool that enables one to create custom e-learning without writing code"
(SmartBuilder.com, n.d.). Before the screencast assignment, I had never heard of, or interacted
with this tool before. However, after watching a few tutorials about the application, I gained a
better sense of the types of functions it could carry out. I had hoped it would help me in creating
interactive, and animated objects within documents. Ultimately, I learned how to create multi-
page templates and drag & drop items.
Before using the application on my laptop, I looked at the website to find more
information about the tool. The tool is divided into two main editions; the community edition and
the professional edition, which can be either hosted on the web or installed on a server. I was
able to get information on the audience of the tool and the types of things it was purported to do.
The website listed their key features and put up supporting documentation to show the types of
things that one would be able to do with their program. However, what most interested me at
first glance was the HTML 5 logo (figure 1).
Figure 1: New HTML 5 Feature

It was prominently displayed on the first page, and I dare say, put there to catch the eye of an
audience member like myself. Of course, this got me excited. When coupled with the types of
examples on the examples page (which was the first tab in a row of tabs), my expectations were
exceedingly high. The website was also purported to be highly interactive. On the home page, it
was written, “Move beyond page turners and canned interactivity” (home page). Strangely, it
seemed to me, the home page was mostly full of accolades and client names. These accolades
and client names, coupled with the user reviews that rotated on the left side of the screen made
my expectations soar even more.
I had signed up for the program with the intention of learning how to do things like the
examples on their website (figure 2).
Figure 2: Example from "Examples" page
Those examples were highly interactive. On the whole, I was not too surprised by the interface of
the application (see figure 3), but I had thought it might look a bit different because of the
HTML 5 addition.

Figure 3: SmartBuilder Interface
I had thought it would look more like Adobe Dreamweaver once the user somehow activated the
HTML 5 function. In truth, one of the advantages of the program that the website stated was that
you did not need to write code. However, I had thought that this “new” function would let
professionals write code. I was misunderstood. On a second look, I saw that the shiny new poster
actually said “publish to html5” (see figure 1). The design of the image made it so that the
HTML 5 words were the primary focus of the message.
I went in with those expectations and was slightly disappointed. However, I did learn
how to do several things. I learned how to add and configure objects, create basic interactivity,
create a Master Page, create a timeline, group objects using a display, use multiple display sets,
create a basic drag and drop, and add gaming elements to a drag and drop. I basically learned
how to insert and remove objects, create a timeline showing what will happen in a lesson, create
drag and drop quiz types and make them interactive by adding movements to them. I was able to
learn these functions using the SmartBuilder tutorial. SmartBuilder was good enough to include a
tutorial pop-up (figure 4).

Figure 4: Tutorial Popup
It helped me reactivate my old habits from using InDesign, which was useful here. The tutorials
were very interactive. For example, when I was learning how to do something, I was able to
actually practice. It was not just videos. Although there is a video page where one can watch
videos detailing such processes, I only had to go through the tutorial once to learn how to use
most of the features.
The tutorial I created for the screencast assignment fulfilled a need that was not
specifically addressed until the user came across the problem. For the tutorial, I taught the
audience how to create multi-page templates. After attempting to save one of the lessons I
created as a template, I realized that SmartBuilder only allows the user to create one page
templates. I was able to solve this problem by advising users to simple copy a lesson using the
“save as a copy” feature, and then change the name of this new lesson. This allowed them to
leave the original lesson unchanged, and therefore available for use as a template of sorts.
The Rhetorical Situation
Audience. In assessing the marketing materials for this application, from the home pages and the
examples page (first contact with the application), my first thought was that it was for a teacher.
This was because the page title, "E-learning authoring tools and services". My previous
interaction with the term "e-learning" had come from articles that had to do with e-learning with
tools like Blackboard. After much more contact with their website, I realized that it was geared

towards project managers and instructional designers who want to create interactive pages for
teaching a lesson (figure 5).
Figure 5: Product Page
I consider myself to be a member of their audience because even though their tool is obviously
geared towards project managers and instructional designers, as seen in figure 5, it is clear from
the simplicity of their message that other technical writers in different sub-genres are welcome as
well.
Despite the amount of reviews on the website that stated the simplicity of the tool, I was
still uncertain as to its level of complexity. The latest feature of the tool, the HTML 5 feature,
indicated that the audience of the tool was shifting direction to a bigger audience with HTML 5
knowledge (See figure 1). I forged on to the tool itself, hoping that my previous knowledge of
HTML 5 would prove useful to me.
Interface designers – Rhetor. The interface of the web application looked simple and
familiar due to my previous knowledge of Adobe InDesign (See figure 6 & 7). The placement of
navigational buttons as well as the whiteness of the screen when one attempts to create a
document is similar. The first look at the design created an impression that it was designed to be
simple and not complex.

Figure 6: Adobe InDesign Interface - Retrieved from http://me.westfull.org
Figure 7: SmartBuilder Interface

Purpose. Using software design and HCI, the interface designers created a web
WYSIWYG (what you see is what you get) application in an attempt to persuade instructional
designers and project managers (the audience) to use the application above others. Should the
argument be successful? Below is the attempt to analyze the web application for its argument as
well as the quality of the HCI in order to answer that question.
Method
Quality of HCI
Below are the criteria with which I will evaluate the quality of the HCI;
 Visual/selective attention capability (Jacko, 2012, p. 8): The ability of the interface design
of a software tool to keep your attention on what is relevant, as opposed to the whole page is
useful. Attention in the selection and execution of action is a good criterion to check for
because the ability of a user to complete their task might dictate whether or not they come
back to use the software tool. As Welsh et al. (2012) write, “attention and action processes
are so tightly linked that the dedication of attention to a particular stimulus automatically
initiates response-producing processes that are designed to interact with that stimulus” (p. 7).
If the page is cluttered or filled with excessive features at a time when the user does not need
them, the user can get lost in doing things other than their primary task. If the user cannot
accomplish their primary task, they might resort to other tools that help them concentrate
better. These tasks might have to do with their jobs, and so the more they complete those
tasks, the better for their lives.
 Stimuli to response compatibility: In discussing stimuli to response compatibility, a look at
the stimuli and their response should be evaluated. Does a stimuli produce an expected
response, and is the response indicated somehow? For example, does an icon that is green
mean go in some form or another? A response (go) that the color green (stimuli) usually
creates an expectation of. As Proctor and Vu (2012) write, “If one stimulus has the meaning
“left” and the other “right,” performance is better if the left stimulus is mapped to the left
response and the right stimulus to the right response, for all stimulus and response modes” (p.
29). Do the stimuli respond as it is supposed to? Does an icon that has a video reel as its icon
produce the desired effect? Here, we might speak a little about convention, particularly
online conventions and what is expected by users who frequently use the web.
 Help Indication/ information availability: Does the design include some kind of help
indicator that can assist the user when they are stuck? So, is this indicator placed in a manner
and place where the user can view it whenever it is needed without working too hard? Is it
placed in a manner that is too distracting for the user while they are completing their tasks?
In addition, does it respond in a manner that is not obstructive? Does the software come with
help documents, whether FAQ forums, tutorials or a blog that can help the user get
information when they come across a problem or a feature they cannot use for some reason
or another? As Jameson and Gajos (2012) write, “presentation of results via means like pop-

up windows risks being obtrusive […] but if the presentation is too subtle, users will often
ignore the information that is offered and derive little or no benefit from the system” (p. 441).
Therefore, it is important that not only is some form of help available, but that it is placed
and responds in a suitable manner. Additionally, we might ask, does the software come with
help documents, whether FAQ forums, tutorials or a blog that can help the user get
information when they come across a problem or a feature they cannot use for some reason
or another?
 Feedback Loop: Is there a way for the user to participate in some type of feedback to the
designer? Feedback is important to making an application more user friendly. If there is a
way for user to review the product or bring up issues with the product, the product will be
more user friendly. Furthermore, this avenue for feedback also provides other users with
potential solutions until the system has been updated. So, is there a community of some kind
for issues and solutions that is easily accessible to users? As Cao (2015) iterates, “Feedback
— what it says, when it comes, how it looks — is your part in the human-computer
interaction” (thenextweb.com). The users have to be able to participate in the process in some
ways so that their needs are viewed as paramount.
 Familiarity/ Appeal to convention: How familiar is the graphical interface? Does the
software do what others in its same category do? For example, if it is categorized as a
spreadsheet maker, does it at least make a spreadsheet? That is, does the application behave
in a similar manner to others in its category? And if it does not, does this new change
improve its ease of use? The more familiar the interface is, the faster it is for the user to
comprehend. As Sutcliffe (2012) adds, “we understand the world by making sense of it with
our existing long-term memory. Consequently, if multimedia content is unfamiliar, we
cannot make sense of it” (p. 389). The more unfamiliar the interface, the more negative
emotions it may inspire in the user.
 Accessibility: Technology is pervasive and affects the lives of everyone. As such, everyone
should be considered when designing an interface. Hanson (2012) supports this view when
she writes that “the ability of everyone to participate in our increasingly technological society
is crucial. “(p. 940). So, it is crucial to evaluate whether an application is accessible to older
adults, those with low literacy skills and those with disabilities. According to Gribbons
(2012) “there are an estimated 876 million illiterate adults in the world, which represents
nearly a quarter of the world’s population” (p. 915), and according to the National Institute
on Deafness and Other Communication Disorders (NIDCD), “about 28 million people in the
United States have some degree of hearing” (As cited in Hanson, 2012, p. 933). Older adults
are a big number of both populations, and since this is a technological age, it is important to
make technology accessible to them as well. Czaja and Lee (2012) iterate the importance of
including older adults in the HCI domain when they write that “given that older people
represent an increasing large proportion of the population and will need to be active users of
technology, issues surrounding aging and information technologies are of critical importance
within the domain of human– computer interaction (HCI)” (p. 757). Ultimately, those with

disabilities, older adults and those with low literacy skills need to be considered in the HCI
domain as well.
 Interactivity: The more interactive an interface is, the more the user can create habits that
can then be repeated to make their experience more pleasant. According to Sutcliffe (2012),
“Interaction design is essentially a set of choices along a dimension from simple controls
such as menus and buttons where the user is aware of the interface” (p. 399). Anything that
makes the user aware of the interface would then be considered interactive. Interactivity
stimulates the memory, an important part of habit forming, so that the user can remember
what processes to carry out to complete their task without having to learn the process again.
As Sutcliffe (2012) states, “More vivid experience that forms better memories […] memory
is an active process. Interaction increases arousal and this make the user’s experience more
vivid, exciting, and memorable” (p. 390 - 391). The more vivid and arousing an interface is,
the more pleasant a painful task might be.
 Negative/ positive emotional goal congruency: Individuals have negative and positive
emotions based on the progress of their intended tasks. When a goal (task) is not progressing
as expected, it creates negative emotions of stress. Are there any interruptions to the use of
the software that can create stress and other negative emotions? Does the software allow the
user to have more positive emotions than negative ones? As Szalma, Hancock & Hancock
(2102) write, “when individuals appraise events relative to their desired outcomes (goals),
negative, “goal-incongruent” emotions and stress can be produced if such events are
appraised as hindering progress. Conversely, promotion of well-being and pleasure occurs
when events are appraised as facilitating progress toward a goal (i.e., goal-congruent
emotions). Promotion of pleasure and happiness […], therefore, requires the design of
environments and tasks themselves that afford goal-congruent emotions” (p. 58). The more a
task is viewed as progressing, the more positive the emotions of the user get. The software
should be created in such a way that it facilitates more positive than negative emotions. In
addition, does the cognitive workload that the application present appear to be neither too
low nor too high? As Szalma, Hancock & Hancock (2102) write, “[…] computer-based tasks
that impose either too much or too little demand will likely be appraised as stressful. In the
latter case, the underload stress will be interpreted as boredom (61). If the cognitive workload
imposed upon the user too high, there will be more negative emotions of stress than positive,
and if it is too low, feelings of boredom that can lead to distractions can defer the completion
of a task.
 Input technologies/ Browser Compatibility: Does the application require a special input
technology, modality or interaction technique that is not well suited to the type of software
category? (Hinckley & Wigdor, 2012, p. 97). Furthermore, does the application work with at
least three of the popular web browsers? Does it require special intermediary devices (other
than a keyboard and a mouse) to make it work? That is, do you have to download a program
or buy a special type of device to make it work? Consider a software application that allows
people to paint digitally, further enhanced by a stylus that allow people to perform the same

functions they could with just their hand. An average user might create a better painting
using a stylus than their hands. If the interface designer considered the differences (based on
data) that arose from an average user using either their hand or a stylus, and (for example)
saw that an average user could create a much better painting with a stylus, considering that
idea while designing would be reasonable. If the designer then went one step ahead and
created a special stylus as opposed to one that their audience member could get from any
retailer, that might curtail the size of their users, especially if the designer went even further
and added special tasks that could only be completed by that special stylus. If the user had
actually decided on that particular software based on a task that only the special stylus could
do, and they did not know beforehand that they had to have the special stylus, this would
hinder their task and create negative feelings towards that application. As Hinckley and
Wigdor (2012) reiterate, “A designer who understands input technologies and the task
requirements of users has a better chance of designing interaction techniques that match a
user’s natural workflow and that take appropriate advantage of a user’s innate abilities” (p.
100). Understanding the task requirement of a user and the type of input technology that
might be useful in making their tasks much more pleasant is a good skill for a designer to
have. A user who draws on their tablet with their fingers will realize that the task might be
much more pleasant with a stylus. However, if they had to have a special stylus, they might
not want to use that application and might in fact opt for another instead.
 Attractiveness/ Unity of Graphics & Color: Is the application attractive to look at? Are the
color themes constant throughout the tool or website? It is important to evaluate the
attractiveness of a website. Sutcliffe (2012) supports this notion when he writes that, “the
attractiveness of multimedia is now a key factor especially for websites” (p. 388). In
addition, he writes that “attractiveness is often influenced more by content than the choice of
media or presentation format (p. 395). So, does the application stimulate and engage users
due to the attractiveness of its interface? That is, is the content that which will be attractive to
a potential audience member? The more attractive the interface is, the more stimulating it is
for the user, and the more pleasant their task will be for them.
 Appeal to user’s knowledge: Does the visual content presented on the page appeal to the
user’s knowledge? Are the expected icons present? Does it appeal to the diverse user? That
is, does it contain information that the novice and professionals will both find useful? The
information presented will not mean the same to each user. A novice user might ignore
something that a professional user of that application category might find extremely useful.
Sutcliffe (2012) supports this notion when he writes that “the information people assimilate
from an image also depends on their internal motivation, what they want to find, and how
well they know the domain” (p. 389).
Software's Argument
Below are the criteria with which I will evaluate the software's argument;

 Visual/selective attention capability: For the same reason listed above.
 Stimuli to response compatibility: For the same reason listed above.
 Familiarity/Appeal to Convention: For the same reason listed above.
 Credibility: The credibility of a website affects how the user perceives the website. The
more credible the user finds the site, the more interested they might be in purchasing its
product. Does the application create feelings of trust for the user in any discernible way? If it
does, how does it do it?
 Help indication/ information availability: For the same reason listed above.
 Learnability: The ease of learning affects how the user views a product. Is the tool easy to
learn or at least presents itself as easy to learn? Are the terms used to refer to objects written
in simple English or a simple form of whatever language it is written in? Does it do what it
advertises it can do? Do goals have to be modified to a lesser or higher degree after seeing
that what the software was advertised to do requires much more effort than was advertised?
The higher the degree of goal modification, the higher the level of learnability. That is, if the
tool encourages the new user to increase the complexity of their work, they (the user) then
must perceive the tool as easily learnable.
 Accessibility: For the same reason listed above.
 Interactivity: For the same reason listed above.
 Attractiveness/ Unity of graphics & color: For the same reason listed above.
 Repetition: Are there repetitions of the same features? And, are there a number of ways to
do one thing? Repetition causes the user to form habits that can change their outlook on the
easiness of the tool. The more repeated the features, the easier it seems to use.
 Intuitiveness: Is the software intuitive? Can a user perform basic functions without any
previous tutorials? The intuitiveness of a tool can affect whether a user recommends the tool
to an audience member like themselves.
 Input technology/ Browser Compatibility: For the same reason listed above.
 Pricing: Is the application free to use? The price of an application is sometimes a
determining factor, especially since there are others in its category that are free.
Table 1: Evaluation Criteria Comparison
Criteria HCI Software’s Argument
Visual/selective attention
capability
 
Stimuli to response
compatibility
 
Help Indication/Information
availability
 
Feedback Loop  
Familiarity/ Appeal to
convention
 

Accessibility  
Interactivity 
Negative/ positive emotional
goal congruency

Input technologies/ Browser
Compatibility
 
Attractiveness/ Unity of
graphics & color
 
Appeal to user’s knowledge 
Credibility 
Learnability  
Repetition 
Intuitiveness 
Pricing 
Findings
It should be noted that my findings are mostly relevant to users who have the same
reactions as I do. As an audience member, I am able to use my experiences with the tool to
evaluate it. Every user is different and as such might have different reactions than I do to certain
stimuli. As Szalma, Hancock & Hancock (2012) write, “one person’s threat is another’s
challenge (p.57). As such, my findings will need to be replicated among a larger sample in order
to provide even more useful information. In evaluating the HCI quality, I focused mainly on the
interface, while with the software’s argument, I focused on both the website and the software
interface. I focused on the website because it was the part that “sold” the message. Furthermore,
it was the true starting point for a potential user. I found that the interface met most of the HCI
criteria and that it’s software argument is potentially persuasive to the audience.
The website and application graphical interface were stable and did not require the user to
keep shifting their attention to features that might hinder whatever task they were working on at
the moment. In evaluating the visual/selective attention capability, I was looking for any abrupt
change to the interface that required exogenous attention. According to Jacko (2012),
“Exogenous shifts of attention are typically caused by a dynamic change in the environment such
as the sudden, abrupt appearance (onset) or disappearance (offset) of a stimulus […], a change in
the luminance or color of a stimulus […], or the abrupt onset of object motion” (p. 8). To
evaluate that criteria, I simply created a new lesson and carried out the simple function of
creating a multi-page template. I thought this action was a good choice to use because it was the
lesson I had created a tutorial for, and as such, it was familiar to me. I worked on the template for
a few minutes, and in that time, there was no dynamic change in the environment. There were no
popups of any kind, nor did any image suddenly take a shift of color, thereby prompting my
attention. In fact, the interface seems to have been built so that a user can decide to focus only on

certain aspects of a page or all of it. This function is assisted by the separation of the layers panel
and other features panels from the whiteboard. The white board is right in the middle of the page
and the only thing that is a part of it, from the onset, is the page number icon (see figure 3). The
segments (panels and whiteboard) of the interface allow for good attention interaction. You can
even make your whiteboard bigger, thereby taking even more prominence on the page, and
somewhat exclude other items on the page (see figure 18). In addition, the icons are very small in
comparison to the whiteboard, and so it is quite clear what your attention should focus on. In
terms of the website, each page has a testimonial that changes when the page is refreshed, and
also after a set time.
Figure 8: Testimonial Example
The testimonials all have the same style and format and so the change is not jarring, and did not
require a shift of attention from me. The website, although colorful, did not exhibit any
unexpected, colorful movements that might require exogenous shifts of attention on all pages.
The response to stimuli capability of the graphical interface & website were suitable. In
evaluating the stimuli to response compatibility, I looked at whether a stimuli produced an
expected response. To test this, I decided to use icons because they produce an immediate
response when pressed. To do this, I tested the first few icons. I restricted my choice to the first
few actions because they were basic functions while some of the others required for something to
be on the board first (figure 9).
Figure 9: First Few Icons

The first icon I tested was the video icon. I was able to tell that it was the video icon because the
icon image was that of a video reel, and the icon had a caption that said video once I hovered
over it. Next, I clicked on it. As I expected, based on the familiar convention of image/function
congruency, I got the response I expected. A video placeholder popped on the whiteboard. My
experience with the video icon rang true for the other icons as well. The website also responded
as it was supposed to. The navigational tabs were aptly named and did not surprise me with an
unexpected category of information.
The website and interface both have help indicators that allows the user to have access to
help information. Before creating a lesson through the application, the user has two avenues for
reaching help. First, once the user is logged in, there is a popup that provides an option to see
video tutorials and other help information (see figure 4). If the user closes that popup, there is
also the option of “Learning resources” on the main page (figure 10).
Figure 10: Learning Resources
When creating a lesson, a user has access to three help indications; live support, forum and help
links are available for the user. They are placed at the top right hand corner of the page which is
typical. It does not look too distracting but I had to look for it just a little bit longer. It was out of

bounds of the icons that affect the whiteboard (figure 11).
Figure 11: Help Indicator
When I clicked on all three help links, it responded quickly by opening new windows, which was
a suitable response. The website also had a Support page that had these options as well (Figure
12).
Figure 12: Website Support Page

The website also has a Blog page that users can access. Users also have the opportunity to “Ask
a chat question” on the website via the “Live support chat” link in the software interface. In
addition, users can “request a live demo”, “sign up for free training sessions”, and access the
FAQ page via the website (Training section) and application.
The software and website both have avenues for feedback and there is evidence that there
is a feedback loop. In evaluating the feedback loop process, I looked at both the website and
software interface. The live support, forum and help links were all manners in which a user could
send feedback to the interface designers. The website also has a support page with all three
features and an additional feature, “the SmartBuilder group” (see figure 11). According to
SmartBuilder.com, “the purpose of the User Group is to support SmartBuilder users by
facilitating discussion around elearning design, elearning authoring, graphic design and
SmartBuilder usage” (n.p.). It was also evident that they had used the feedback somehow
because this was version 3.14 of the software (figure 13).
Figure 13: Version 3.14 Indicator
The notation attached to the announcement of the new version is located on the home page, so it
is immediately visible to the user. In addition, it advises users to see the forum for new
enhancements and bug fixes, further encouraging the user to communicate with them.

The graphical interface is similar to other types of application in its software category. In
evaluating familiarity and appeal to convention, I looked at the interface and website. As I stated
earlier, the interface is familiar to me, as it should be to those who use Adobe InDesign (see
figure 6 & 7). Adobe InDesign is a very popular and trustworthy tool. The similarity of
SmartBuilder to Adobe InDesign also contributes to its credibility. The website, although
transient in its content, did not differ all that much in organization and style, in comparison to
other websites of that category. The only notable difference, as I stated earlier, was that the home
page was full of accolades and major client names (figure 14).
Figure 14: HomePage
This was a little off-putting to me at first, and I kept having to double check the URL to make
sure it was on the home page.

The website was not completely accessible while the interface seemed, overall,
accessible. To check if the website was accessible, I ran it through 508checker.com and
PowerMapper. I got the website (508checker) through the w3 (world wide web consortium)
website, a reliable website. The 508checker website checks for website compliance. The 508 law
is a good standard for evaluating all websites for accessibility even though it is only enforced in
federal agency websites. According to 508Checker, the SmartBuilder website was not 508
compliant (figure 15).
Figure 15: 508checker complaint result

According to 508checker, it contained errors that would affect people with vision loss (low
contrast), people with hearing loss (missing form label and everything in the yellow area), and
other common errors that might affect everyone.
I also used PowerMapper which I found on Google to perform accessibility standard
testing. I have never used it before, and that’s why I also used 508 checker which I got from a
more credible source. PowerMapper checks WCAG 1.0 & 2.0 and Section 508 compliance. For
checking WCAG 2.0 standards, it uses “117 tests covering A, AA and AAA guidelines”
(powemapper.com, n.p.). For checking WCAG 1.0 standards, it uses “89 tests covering A, AA
and AAA guidelines”, and for checking Section 508 standards, it uses “56 tests covering 15
guidelines” (powemapper.com, n.p.). It also checks HTML, CSS, JavaScript, PDF, GIF, and
Flash formats. According to PowerMapper, the SmartBuilder website was 63% complaint (figure
16).
Figure 16: OverallResults
PowerMapper also checks for readability and usability (see Figure 17) which affects low literacy
readers. SmartBuilder did pass the readability test (Figure 17).
Figure 17: Readability Result via PowerMapper

The report was long and detailed. Due to the length of the report, I have attached a link to the
report. The interface, I considered accessible to people with visual problems because it had
alternate text popups that whatever device they were using to read could see. In addition, as I
stated earlier, the user can make the whiteboard bigger (figure 18).
Figure 18: Zoom Feature
The website and interface are interactive. Anything that makes the user aware of the
interface is interactive. In terms of the website, the color combination and the cartoon on the
pages made my experience more vivid (figure 19).
Figure 19: Cartoon Theme
This is an
image of an
enlarged
whiteboard.
Notice the
zoom icon.

The cartoon was a consistent theme on each page, although every image was different. The
examples page of the website also had examples that were interactive (see figure 2). The
examples varied and one could actually see what a lesson could look like. Once you clicked on
the examples, it would take you through a lesson, and all the lessons required your participation
and attention. These features all piqued my interest in the application. The application itself also
had a WYSWYG (what you see is what you get) feature that gave me the ability to see my
changes, via the preview lesson icon. This helped me as a user to be more engaged in what I was
doing.
The software created mix feelings of negative and positive emotions. To test
negative/positive emotional goal congruence, I chose to use the task I used for my tutorial
because it was stressful for me. However, most tasks were straight forward, and as I have stated
earlier, response to stimuli compatibility was suitable in terms of overall tasks. However,
particularly with my tutorial task (creating a multi-page template), I had to go and look for a way
to accomplish that task. Although there was a template feature, it only allowed the user to save
one page templates. I was not aware of this till I tried to access my template and saw that it only
had one page. I tried again and again thinking I had messed something up, and finally had to go
and look for a solution. I was able to find a solution from SmartBuilder itself online, but I could
not quite grasp it. I tried to do what they said, but I was so stressed by then that I could not
comprehend what they wanted me to do. So, I came up with my own solution. However, before
I came up with my solution, I had tried several times to create multi-page templates and this
created negative emotions of stress for me. It was so stressful that when I finally saw their
solution, after expecting a straightforward solution, I did not even understand it. It was only after
a few days and after I created my solution that I was able to then comprehend what they were
saying. But by then, it was too late.
The application does not require anything more than a computer that has a browser. The
application works with at least three of the popular web browsers; Internet Explorer, Google
Chrome and Safari. However, as I stated earlier, the professional version can be installed on a
server. SmartBuilder does not require any special intermediary devices, nor do you have to
download a program to use it.
The website and graphical interface are attractive to look at. There is a unity of graphics and
color. The colors are compatible (green and burnished yellow). This color theme is prevalent in
both the website and the graphical interface.
Some of the features of the software appeals to varying user’s level of knowledge. The
interface, as I have stated earlier, is quite similar in looks to Adobe InDesign. It is more than
similar in looks, it also has many of the same features, such as graphic, video and audio
placeholders. These are familiar features than even a novice user would expect, yet there are also
professional features that someone who uses authoring tools frequently would expect to see. For
example, the “publish to HTML 5” feature might not mean much to a novice audience member,

but it might mean a lot more to someone with much more professional knowledge. This appeal to
the user’s knowledge was also present in the webpage via the Publish to HTML 5 poster (figure
1).
The application creates feelings of trust for the user. The website home page has a list of awards
and accolades. It also has a list of big name, popular clients that users might recognize (see
figure 14). The pricing page also has a rotating list of real user reviews (testimonials) (see figure
8). The similarity to Adobe InDesign also contributes to its familiarity, which then contributes to
its credibility.
The tool presents itself as easy to learn. The icons and other written words are written in
simple English. Does it do what it advertises it can do? In some ways yes. I certainly learned to
do new things, such as to create interactive drop and drag items. In addition, the tutorials make
things seem easy to learn. The pervasive presence of learning resources on both the website and
via the application interface does not hurt either. My goals did have to be modified in a lower
capacity after using the tool itself. I think that if a novice user of authoring tools had a goal like
the ones in the examples, it would require them to spend more time than I have spent on the tool.
A professional might have more luck creating examples like those that SmartBuilder presented.
Overall, I believe that more preparation and a plan could make the tool much easier to use. If the
user has a goal, then I think they could achieve it using the tutorial lessons.
There are repetitions of the same features in terms of colors and image types. As I stated
earlier, the cartoons are a consistent theme on the website. In the software application, there are
several ways of performing the same action. For example, you can open a lesson via the home
page or via the lesson folder (figure 20).
Figure 20: Accessing the Lesson

The software is intuitive. For example, the icon images are indicative of the
corresponding feature. In another case, the system also helps you keep track of the changes youre
making. For example, if a user attempts to exit a page when they haven’t saved their changes, the
system will prompt the use to save it (figure 21).
Figure 21: Intuitive saveprompt
The system also autosaves changes so that if something changes accidentally, the user can
recover their original documents (figure 22).
Figure 22: Autosave Popup
I was able to perform basic functions without a tutorial. For example, I was able to start creating
a new lesson right away (figure 23).

Figure 23: Create a New Lesson
The application is free to sign up, but not completely free to use. The website advertises
the application as free to sign up, which is technically true. However, that idea can be misleading
because there are other versions that a user can purchase that would provide more features. As I
stated earlier, the tool is divided into main two editions, the community edition and the
professional edition, which can be either hosted on a server or installed (Figure 24).
Figure 24: Pricing

The community edition is free while the professional edition is not. There are only a few notable
differences between both editions, however, many of the tools unavailable on the community
edition will be very useful for the workplace (Table 2).
Table 2: Notable differences between both editions
Features Community Edition Professional Edition
PowerPoint Import –
Download Content –
Translation Tool –
Review Tool –
Collaborate with team
members
–
The download content feature can be useful for downloading a lesson for packaging purposes.
The translation tool can be useful for translating the lesson to other languages. Collaboration is
also useful in cases where the user is part of a team. The Support page which does not say
anything about pricing, also has a sign that says “Next step: Sign up for free” which can be
misleading to users who did not do enough research (see figure 12).
Recommendations
Overall, the website is well designed and the HCI quality is high. However, I have some
recommendations. They are as follows; create more visibility for help indicators, work on
accessibility, create a more straight-forward way to create multipage templates, and work some
more on the in-house tutorials..
The Help indications blended in although it was placed at the conventional place. My
recommendation would be to make it a color (maybe white) that does not blend in too much, and
yet does not divert the user’s attention constantly. Another option can be to create an icon next to
the help indicators, maybe one in green and white or yellow to match the color theme of the
organization. This should help draw the attention of the user only when they need it because they
are already used to that color theme, and would not be easily distracted by it. In fact, it might
make it easier for their eye to snag it when they need it. The user should not mistake the icon for
a link especially since the actual links are underlined and therefore denote themselves as links, as
is conventional.
There should be more research into the accessibility of the website and application interface,
even though SmartBuilder is not a federal agency. One of the ways in which this can happen is
for the organization to sign up for PowerMapper since it checks for other types of compliance as
well. Another option is to hire an in-house team that can keep the application and website up to
date as changes are made to accessibility laws. The website needs to fix the HTML coding in

order to repair some alternate text information, a redundant link, create heading levels and
generally fix other coding errors. 508 checker also caught the low contrast problem between the
background and foreground. This might require a rebranding or a slight darkening of either the
foreground or background color.
The multi-template issue should also be corrected. SmartBuilder can fix the multi-page
template issue by creating a feature for it or simply change the current template commands. Due
to finances, another option could be to make the multi-page template a part of the FAQ. It is not
part of the FAQ questions at the moment.
The examples on the examples page seem complex once a novice user starts working
with the application. One of the ways in which this can be repaired is for the website to create
tutorials that can guide the user in creating that exact example. This can create a feeling of trust
on the user’s part. Although there is a live free demo, it often seems like a complicated step to
take because users usually have not downloaded the application once they see that a demo can be
requested. Furthermore, demos like that often inspire distrust in users. From personal experience,
I view demos as a marketing tool that usually requires me to hand out information about myself,
which usually leads to me receiving sales pitches. Having a demo that can be accessed in a few
steps and without any handout of information from the user can be helpful in persuading the user
to download even the professional version, especially if some features from the examples can
only be accessed via the paid version.
If these recommendations are considered, the website and application will be more user
friendly and perceived as such by users.
Conclusion
Overall, the software is making a convincing argument, and the quality of HCI is high. The
presence of a free community edition is persuasive to the audience. This can lead the audience to
at least try out the application. The application does not need to be downloaded, which makes it
different from some other types of authoring tool in its category. The home page was full of
accolades and major client names which is an appeal to ethos that can be very convincing to
users. Users will more likely trust a tool that has other trustworthy users. The color theme and
cartoon images were vivid and dynamic, which made the tool memorable. The interactivity level
of the examples of lessons also piqued my interest in the website and seemed like something
even I could do.
Ultimately, this website would be successful in convincing a potential user to try it out.
The software is also user friendly and promotes human-computer interaction.

References
508Checker. (n.d.). Retrieved from http://www.508checker.com/check
Cao, J. (2015). How to change user habits with interaction design. Retrieved from
http://thenextweb.com/dd/2015/03/11/how-to-change-user-habits-with-interaction-
design/
Czaja, A. & Lee, K. (2012). Older Adults and Information Technology. In J. A. Jacko (Ed.), The
human-computer interaction handbook: Fundamentals, evolving technologies, and
emerging applications (3rd ed., pp. i-1405). Florida: CRC Press.
Gribbons, W. (2012). Universal Accessibility and Low-Literacy Populations. In J. A. Jacko
(Ed.), The human-computer interaction handbook: Fundamentals, evolving
technologies, and emerging applications (3rd ed., pp. i-1405). Florida: CRC Press.
Hanson, V. (2012). Computing Technologies for Deaf and Hard of Hearing Users. In J. A. Jacko
(Ed.), The human-computer interaction handbook: Fundamentals, evolving
Hinckley, K. & Wigdor, D. (2012). Input Technologies and Techniques. In J. A. Jacko (Ed.), The
Jacko, J. A. (2012). The human-computer interaction handbook: Fundamentals, evolving
technologies, and emerging applications (3rd ed.). Retrieved March 27, 2016, from
http://site.ebrary.com/lib/uhdowntown/detail.action?docID=10558361
Jameson, A. & Gajos, K. (2012). Systems that Adapt to their Users. In J. A. Jacko (Ed.), The
Proctor, R. W. & Vu, K. L. (2012). Human Information Processing. In J. A. Jacko (Ed.), The

SmartBuilder. (n.d.). Retrieved from http://www.SmartBuilder.com/
Sutcliffe, A. (2012). Multimedia User Interface. In J. A. Jacko (Ed.), The human-computer
interaction handbook: Fundamentals, evolving technologies, and emerging applications
(3rd ed., pp. i-1405). Florida: CRC Press.
Szalma, J. L., Hancock G. M., & Hancock, P. A., (2012). Task Loading and Stress in Human–
Computer Interaction. In J. A. Jacko (Ed.), The human-computer interaction handbook:
Fundamentals, evolving technologies, and emerging applications (3rd ed., pp. i-1405).
Florida: CRC Press.
Welsh, T. N., Chandrasekharan, S., Ray, M., Neyedli, H., Chua, R., & Weeks, D. J. (2012).
Perceptual-Motor Interaction Some Implications for Human– Computer Interaction. In J.
A. Jacko (Ed.), The human-computer interaction handbook: Fundamentals, evolving
W3. (n.d.). Retrieved from http://www.w3.org/WAI/ER/tools/

Adesiyan Report on GUI effectiveness

Recommended

Recommended

More Related Content

What's hot

What's hot (20)

Viewers also liked

Viewers also liked (6)

Similar to Adesiyan Report on GUI effectiveness

Similar to Adesiyan Report on GUI effectiveness (20)

More from Jelilat Adesiyan

More from Jelilat Adesiyan (13)

Adesiyan Report on GUI effectiveness