USER EXPERIENCE AND INTERFACE DESIGN

A REPORT

1
Contents
Summary.....................................................................................................................................................5
Introduction.................................................................................................................................................6
User Interface..............................................................................................................................................6
User Experience...........................................................................................................................................6
Forms of User experience............................................................................................................................6
The Strategy Plane:..................................................................................................................................6
The Scope Plane:.....................................................................................................................................7
The Structure Plane:................................................................................................................................8
The Skeleton Plane:.................................................................................................................................9
The Surface Plane:...................................................................................................................................9
Forms of user interface.............................................................................................................................10
Natural-Language Interfaces.................................................................................................................10
Menus....................................................................................................................................................11
Command-Language Interfaces.............................................................................................................11
Graphical User Interfaces......................................................................................................................12
Types of end user testing...........................................................................................................................12
Unit tests...............................................................................................................................................12
Integration tests....................................................................................................................................14
Functional tests.....................................................................................................................................14
End-to-end tests....................................................................................................................................15
Acceptance testing................................................................................................................................16
Performance testing..............................................................................................................................16
Smoke testing........................................................................................................................................17
Black Box Testing...................................................................................................................................18
Tools available for user interface design and experience..........................................................................19
Adobe XD...............................................................................................................................................19
Sketch....................................................................................................................................................20
Marvel App............................................................................................................................................20
UXPin.....................................................................................................................................................21
Axure RP................................................................................................................................................22
Impact of common user experience and interface design methodology in the software development
lifecycle......................................................................................................................................................24

2
 Software Development Life Cycle (SDLC)...............................................................................................24
Traditional Software Development Methodology.................................................................................25
Agile Software Development Methodology...........................................................................................26
Spiral Model..........................................................................................................................................27
Iterative Model......................................................................................................................................28
Different end user categorization..............................................................................................................29
Beginner user........................................................................................................................................29
Intermediate users................................................................................................................................30
Expert users...........................................................................................................................................30
Categorizing Your Audience.......................................................................................................................30
Categorizing Users by Role........................................................................................................................31
Categorizing Users by Knowledge/Experience Domains............................................................................31
Categorizing Users by Shared Similarities..................................................................................................32
BEHAVIORAL MODELS...............................................................................................................................33
BEHAVIORAL STATE MACHINES.................................................................................................................33
INTERACTION DIAGRAMS..........................................................................................................................34
AN EXAMPLE OF A CUSTOMER JOURNEY MAP..........................................................................................35
Model chosen for Unilever Kenya.............................................................................................................35
Iterative model......................................................................................................................................35
Unilever Kenya Limited Testing Methodology...........................................................................................36
Black Box Testing Techniques................................................................................................................37
Unilever Kenya Limited User Interface Plan..............................................................................................38
Overview...............................................................................................................................................38
Aim........................................................................................................................................................38
Objectives..............................................................................................................................................38
Users......................................................................................................................................................38
User requirement..................................................................................................................................39
Type of interface.......................................................................................................................................39
Design tool chosen....................................................................................................................................39
Wireframe design......................................................................................................................................39
Controls used in the various wireframes...................................................................................................45
Tools to develop Unilever Kenya Limited User Interface...........................................................................45
Unilever Kenya Limited Iteration...............................................................................................................46

3
End user experiment and feedback...........................................................................................................52
End user feedback evaluation....................................................................................................................54
Data analysis..........................................................................................................................................54
Feedback analysis..................................................................................................................................54
Response Rate.......................................................................................................................................54
Evaluation of the end user feedback.........................................................................................................55
Unilever Kenya Limited iteration change...................................................................................................57
Conclusion.................................................................................................................................................57
Test plan....................................................................................................................................................58
The goal of the test plan........................................................................................................................58
The scope of the test plan.....................................................................................................................58
Objectives..............................................................................................................................................58
Test Pass/Fail Criteria................................................................................................................................59
Critique of the overall success of Unilever Kenya Limited user interface concept and insight using
prototyping................................................................................................................................................60
References.................................................................................................................................................62

4
Summary
Several different kinds of user interfaces are described, including natural-language interfaces,
question-and-answer interfaces, menus, form-fill interfaces, command-language interfaces,
graphical user interfaces (GUIs), and a variety of Web interfaces for use on the Internet. The user
interface has two main components: presentation language, which is the computer-to-human part
of the transaction, and action language, which characterizes the human-to-computer portion.
Together, both concepts cover the form and content of the term user interface.

This interface will be a smart phone application which will be both a graphical user interface and
a form based interface which provides an overview of UKL and esteemed customers of Unilever
Kenya Limited will be able to buy products from the company while staying safe in their homes
avoiding having to go outside amidst the COVID-19 pandemic. Customers will need to sign in
and this will enable UKL to have all gathered information stored in order to get to know their
customer better as time goes on. Before the actual implementation of the application, MockFlow
was used to create a prototype that would be used as a blueprint to create the application for
Unilever Kenya Limited.

This was to give users an idea of what the application would look like and feedback would be
returned by our end users to decide whether they like the prototype or wish to make any changes,
which they did not. The end users seemed to have liked the prototype and the application that
was later developed. To create the application, Big Cartel was used as it is affordable and quite
easy to use for first timers. The application has a contact page, a main page, a cart page, pages
that are dedicated to the different categorizes of Unilever Kenya products. This feedback was
analyzed and multiple iteration were created before having the final iteration. Test Pass/Fail
criteria was implemented with sheets being provided and they were all a success. The UKL
interface was a success as it met all requirements.

5
Introduction
The main importance of the report is to show evidence of research conducted, plans and the
designed and implemented User Interface. An evaluation of the user experience will also be
carried out by users to ensure it meets all the required objectives to make sure that the
application was a success and the end users were more accepting towards the application.

User Interface
The user interface (UI) is the point at which human users interact with a computer, website or
application. The goal of effective UI is to make the user's experience easy and intuitive, requiring
minimum effort on the user's part to receive maximum desired outcome.

UI is created in layers of interaction that appeal to the human senses (sight, touch, auditory and
more). They include both input devices like keyboard, mouse, track pad, microphone, touch
screen, fingerprint scanner, e-pen and camera and output devices like monitors, speakers and
printers. Devices that interact with multiple senses are called "multimedia user interfaces". For
example, everyday UI uses a combination of tactile input (keyboard and mouse) and a visual and
auditory output (monitor and speakers). (Indeed, 2021)

User Experience
User experience (UX) focuses on having a deep understanding of users, what they need, what
they value, their abilities, and also their limitations.  It also takes into account the business goals
and objectives of the group managing the project. UX best practices promote improving the
quality of the user’s interaction with and perceptions of your product and any related services.
(Usability, 2021)

Forms of User experience

The user experience design process is all about ensuring that no aspect of your applications
happens without your conscious and explicit intent. So in design every possibility of every
action, the user is likely to take under his/her expectations. Therefore the whole user experience
design process breakdown into five main elements.

The Strategy Plane:

6
This is an abstract point where we have to find solutions to our problems. This strategy plane
incorporates not only what Unilever Kenya Limited wants to get from the site, but what the users
want to get out of the site as well. Due to users want to buy products, and Unilever want to sell
them, this plane is about to find user needs and product objectives.

The foundation of successful user experience is a clearly articulated strategy. So knowing both

what Unilever Kenya want the product to accomplish for their organization and what user want
to accomplish throughout their site, Therefor, they have to make decisions about every aspect of
the user experience. So the most common reason for the failure of a web site is not technology or
it’s not user experience either. (Geeksinux, 2021)

Strategy Plane activities:

I) Product Objectives: Product objectives are targets (goals, drivers) for product design and
services. They serve as the basis for strategy, design, refinement, and launch.

II) Brand Identity: Brand identity is a set of visual aspects and conceptual associations or
emotional reactions. So in brand identity, Unilever Kenya defines logos, color, and typography.

III) Success Metrics: Success metrics are brand race finish lines. So when a product has been
launched, success metrics used to see whether it is meeting their own objectives and the user’s
needs. Therefore success metrics are concrete indicators of, how effectively the user experience
is meeting strategic goals. So it is measurement about budget, visitors per month, time per visit
increase, ROI (return on investment) and CR (conversion rate), etc. (Geeksinux, 2021)

The Scope Plane:

The scope plane is a valuable process in which Unilever Kenya gather functional specifications
and content requirements for their applications. With a clear sense of what they want and what
their users want. Strategy becomes scope when Unilever Kenya translate user needs and product
objectives into specific requirements, and functionality the product will offer to users.

7
When going to make their scope, they divide it into these activities, Requirement Gathering,
Functionality Specification, and Content. (Geeksinux, 2021)

Scope Plane activities:

I) Requirement Specification: Requirements at the beginning of the project to describe what

the system should do.

II) Functionality Specification: On the functionality side they’re concerned with what would be
considered the feature set of the application.

III) Content Specification: When talking about content, they’re referring to text. But images,
audio, and video can be more important than the accompanying text. (Geeksinux, 2021)

The Structure Plane:

The skeleton is a site map or top-down structure of a site. So the skeleton might define the
placement of the interface elements on the checkout page. The structure would define how users
got to that page, and where they could go when they were finished there. Therefore the skeleton
might define the arrangement of navigational elements, allowing the users to browse categories
of products. When going to make the structure, they divide it into these activities, interaction
design, and information architecture. (Geeksinux, 2021)

Structure Plane activities:

I) Interaction Design: Interaction design is concerned with describing possible user behavior

and defining how the system will accommodate and respond to that behavior. So interaction
design concerns the steps involved in performing and completing tasks. Therefore interaction
design relates to the conceptual model and Hierarchical task analysis.

II) Information Architecture: Information architecture (also known as IA) is the foundation for
great Web design, mobile design and for any other software. So information Architecture shows
a complete road map or site map of the application, it provides information about navigation bar

8
and interaction between pages of site or application. Information Architecture is a model of an
application. (Geeksinux, 2021)

The Skeleton Plane:

The Surface plane is about an arrangement and placement of web elements buttons, controls,
Toggles, photos, and blocks of text. The skeleton also called interface design. Therefore the
skeleton is designed to optimize the arrangement of the elements for maximum effect and
efficiency. So skeleton is the wireframing of the applications, it’s a purpose to find product
element easily. When the go to make the skeleton, they divide it into these activities, Interface
design, Navigation design, Information design, and wireframes. (Geeksinux, 2021)

Skeleton Plane activities:

I) Interface Design: Interface design is all about selecting the right interface elements for the
task the user is trying to accomplish and arranging them on the screen in a way that will be
readily understood and easily used.

II) Navigation Design: Navigation design is about putting links on every page that allow users
to get around on the site. Therefore navigation design of any site must accomplish three
simultaneous goals

III) Information Design: Information design comes down to making decisions about how to
present information so that people can use it or understand it more easily. Sometimes
information design is called visual design. So information design explains which information
comes first and which meaningful icon we should use. (Geeksinux, 2021)

The Surface Plane:

The surface plane is a sensory design. So here, content, functionality, and aesthetics come
together to produce a finished design, that pleases the senses while fulfilling all the goals of the
other four planes. On the surface, they can see a series of web pages, made up of images, text,
illustration, graphic work and other animation work. Some of these images are things they can

9
click on, performing some sort of function such as taking the users to a shopping cart. Therefore
on the surface plane, Unilever Kenya ensure visual design making Sense. (Geeksinux, 2021)

Surface Plane activities

I) Visual Design: In visual design, Unilever Kenya determines how that arrangement should be
presented visually.

II) Making Sense: Determining how everything about their design will manifest to people’s
senses. Which of the five senses (vision, hearing, touch, smell, and taste).

III) Uniformity: Uniformity (consistency) in their design is an important part of ensuring that

the design communicates effectively without confusing or overwhelming the users. Therefore
uniformity comes to play different aspects of visual design. For example, keeping the sizes of
elements uniform can make it easier to recombine them into new designs as they need them.
(Geeksinux, 2021)

Forms of user interface

Natural-Language Interfaces
Natural-language interfaces are perhaps the dream and ideal of inexperienced users, because they
permit them to interact with the computer in their everyday, or natural, language. No special
skills are required of the user, who interfaces with the computer using natural language.

The display depicted in the figure below lists three natural-language questions from three
different applications. Notice that interaction with each seems very easy. For instance, the first
sentence seems straightforward: “List all of the salespeople who met their quotas this month.”
(w3computing, 2021)

Attempts at natural-language interfacing for particular applications in which any other type of
interface is infeasible (say, in the case of a user who is disabled) are meeting with some success;
however, these interfaces are typically expensive. Implementation problems and extraordinary
demand on computing resources have so far kept natural-language interfaces to a minimum. The
demand exists, though, and many programmers and researchers are working diligently on such

10
interfaces. It is a growth area, and it therefore merits continued monitoring. (w3computing,
2021)

Menus
A menu interface appropriately borrows its name from the list of dishes that can be selected in a
restaurant. Similarly, a menu interface provides the user with an onscreen list of available
selections. In responding to the menu, a user is limited to the options displayed. The user need
not know the system but does need to know what task should be accomplished. For example,
with a typical word processing menu, users can choose from the Edit, Copy, or Print options. To
utilize the menu best, however, users must know which task they desire to perform.
(w3computing, 2021)

Menus are not hardware dependent. Variations abound. Menus can be set up to use keyboard
entry, light pen, touch screen, or mouse. Selections can be identified with a number, letter, or
keyword, or users can click on a selection with a mouse. Consistency is important in designing a
menu interface. (w3computing, 2021)

Command-Language Interfaces
A command-language interface allows the user to control the application with a series of
keystrokes, commands, phrases, or some sequence of these three methods. The simple syntaxes
of command languages are considered to be close to natural language. (w3computing, 2021)

Two application examples of command language are shown in the figure below. The first shows
a user who asks to use a file containing data on all salespeople, then asks the computer to display
all last names and first names for all salespeople whose current sales (CURSALES) are greater
than their quotas. In the second example, a user asks to use a file called GROCER, and then
directs the computer to calculate the spoilage (SPOILS) by subtracting produce sold from
produce bought. After that is done, the user asks to go back to the top of the file and to print out
(LIST) the file. (w3computing, 2021)

The command language has no inherent meaning for the user, and that fact makes it dissimilar to
the other interfaces discussed so far. Command languages manipulate the computer as a tool by

11
allowing the user to control the dialog. Command language affords the user more overall
flexibility and control. When the user employs command language, the command is executed by
the system immediately. Then the user may proceed to give it another command. (w3computing,
2021)

Graphical User Interfaces

The key to graphical user interfaces (GUIs) is the constant feedback on task accomplishment that
they provide to users. Continuous feedback on the manipulated object means that changes or
reversals in operations can be made quickly, without incurring error messages. (w3computing,
2021)

The creation of GUIs poses a challenge, because an appropriate model of reality or an acceptable
conceptual model of the representation must be invented. Designing GUIs for use on intranets,
extranets, and on the Web requires even more careful planning. Most users of Web sites are
unknown to the developer, so design must be clear-cut. The choice of icons, language, and
hyperlinks becomes an entire set of decisions and assumptions about what kinds of users the
Web site is hoping to attract. The designer must also adhere to conventions that users now expect
to encounter on Web sites. (w3computing, 2021)

Types of end user testing

There are many different types of testing that can be used to make sure that changes to the code
are working as expected. Not all testing is equal, though, and we will see here how the main
testing practices differ from each other. (Atlassian, 2021)

Unit tests
Unit tests are very low level, close to the source of the application. They consist in testing
individual methods and functions of the classes, components or modules used by Unilever Kenya
software. Unit tests are in general quite cheap to automate and can be run very quickly by a
continuous integration server. (Atlassian, 2021)

Pros

12
I) Unit tests make it safer and easier to refactor the code by putting tests into place that make
sure refactoring occurs without problems and disruption. It takes the risk out of changing older
source code. (Theqalead, 2021)

II) Doing unit tests is essentially doing quality assurance of the code. It shows problems and
bugs before the product has an integration test. Creating a testing process before the coding is
completed solves issues and challenges creators to write better code. (Theqalead, 2021)

III) UT helps find problems and resolve them before further testing so they won’t impact other
bits of code. This includes bugs in a programmer’s execution and issues with a specification for
the unit itself. (Theqalead, 2021)

IV) UT allows the refactoring of code and makes integration simpler. It finds changes and helps
maintain and adjust code, reducing bugs and defects, and verifying the accuracy of each unit. It
makes sure the later testing is easier once the integration process begins. (Theqalead, 2021)

Cons

I) With UT, Unilever Kenya have to increase the amount of code that needs to be written. They
usually have to write one or more unit tests depending on how complex things are. It is suggested
to have at least three so they don’t just get a yes and a no that contradicts each other. While the
test code should be fairly simple, this testing method is still more work and more code which
means more hours and more cost. (Theqalead, 2021)

II) Unit tests are problematic when Unilever Kenya need to test their user interface (UI). They
are good for when they need to test business logic implementation but not great for UI.
(Theqalead, 2021)

III) There is a school of thought that unit tests are problematic for a product’s structural design.
They solidify the structure of code which means change can be problematic when needed.
(Theqalead, 2021)

IV) In comparison to those who say UT improves code, others say it makes it worse and ends up
adding indirection that is pointless. Changing code and adding new code can mean navigational
issues and more time spent before integration testing is even started. (Theqalead, 2021)

13
Integration tests
Integration tests verify that different modules or services used by the application work well
together. For example, it can be testing the interaction with the database or making sure that
micro services work together as expected. These types of tests are more expensive to run as they
require multiple parts of the application to be up and running. (Atlassian, 2021)

Pros

 As discussed above, it helps in identifying integration issues between the modules.

 It helps in ensuring that the integrated modules work properly before moving to the
system testing of the complete application.
 Bugs found at this level are easier to resolve as compared to the one found at later stages
of testing – system and acceptance testing.
 It improves test coverage and provides an additional level of reliability. (Artoftesting,
2021)

Cons

I) Difficult to perform – It is very difficult to perform as compared to system testing in which we

can consider the application as a black box. (Artoftesting, 2021)

II) Time-consuming – It is very time-consuming and resource-intensive to test all the interfacing
between the different connected modules. (Artoftesting, 2021)

III) Additional efforts – It requires the creation of stubs and drivers which if not created correctly
can result in inadequate testing. (Artoftesting, 2021)

Functional tests
Functional tests focus on the business requirements of an application. They only verify the
output of an action and do not check the intermediate states of the system when performing that
action. (Atlassian, 2021)

There is sometimes a confusion between integration tests and functional tests as they both
require multiple components to interact with each other. The difference is that an integration test

14
may simply verify that they can query the database while a functional test would expect to get a
specific value from the database as defined by the product requirements. (Atlassian, 2021)

Pro

I) This testing type is conducted in the conditions close to the customer’s ones (it is ideal if there
are the same operating systems, browsers, database etc.) (Strongqa, 2021)

Con

I) The possibility to omit logical mistakes in software;

II) The probability of redundant testing. (Strongqa, 2021)

End-to-end tests
End-to-end testing replicates a user behavior with the software in a complete application
environment. It verifies that various user flows work as expected and can be as simple as loading
a web page or logging in or much more complex scenarios verifying email notifications, online
payments, etc... (Atlassian, 2021)

End-to-end tests are very useful, but they're expensive to perform and can be hard to maintain
when they're automated. It is recommended to have a few key end-to-end tests and rely more on
lower level types of testing (unit and integration tests) to be able to quickly identify breaking
changes. (Atlassian, 2021)

Pros

 End-to-end tests replicate the user actions to complete certain tasks. Failure to run a test
indicates a user workflow is interrupted which proves the value of having the test.
 End-to-end tests offer both functional and system testing. While verifying the user
workflow, we are testing the different systems involved as well as the functionality of the
app but through the UI.
 End-to-end tests find lot of user impacting bugs. (LinkedIn, 2021)

Cons

15
  End-to-end tests take long to run depending on how Unilever Kenya have written the
tests. Tests verifying complicated workflows take longer to run and become difficult to
troubleshoot.
 These tests are flaky as a slight change in UI will break a test.
 Failed tests do not pinpoint to the bug in application. Some investigation is required as
compared to unit tests. 
 Regular maintenance is required to run these tests. (LinkedIn, 2021)

Acceptance testing
Acceptance tests are formal tests executed to verify if a system satisfies its business
requirements. They require the entire application to be up and running and focus on replicating
user behaviors. But they can also go further and measure the performance of the system and
reject changes if certain goals are not met. (Atlassian, 2021)

Pros

 It helps in the discovery and fixation of the issues relevant to usability very early
 It portray your system usability
 It is easy to integrate the feedback in an early stage of development (Invisionsolutions,
2021)

Cons

 It requires time to set up

 Requires a different environment for testing, rather than same testing environment
 It requires a test audience that is well defined (Invisionsolutions, 2021)

Performance testing
Performance tests check the behaviors of the system when it is under significant load. These tests
are non-functional and can have the various form to understand the reliability, stability, and
availability of the platform. For instance, it can be observing response times when executing a
high number of requests, or seeing how the system behaves with a significant of data.
16
Performance tests are by their nature quite costly to implement and run, but they can help
Unilever Kenya understand if new changes are going to degrade their system. (Atlassian, 2021)

Pros

 Validating the basic features of the application give you confidence to announce notable
business decisions based on your software. (Testbytes, 2021)
 Testing helps you know whether the features of your software are set in such a way to
please the users (Testbytes, 2021)
 Able to detect the mismatches and rectify it before the software gets published.
(Testbytes, 2021)
 Performance testing enhances your optimization and capacity planning efforts.
(Testbytes, 2021)

Cons

 Some functional errors are only visible under load. There is a chance for not detecting
such errors while doing performance testing.
 Testing ends as a mere process if it is not programmed and executed carefully.
 If testing is not performed on various devices, it might cause variation in results and
hence users experience difficulties. (Testbytes, 2021)

Smoke testing
Smoke tests are basic tests that check basic functionality of the application. They are meant to be
quick to execute, and their goal is to give Unilever Kenya the assurance that the major features of
their system are working as expected. (Atlassian, 2021)

Smoke tests can be useful right after a new build is made to decide whether or not they can run
more expensive tests, or right after a deployment to make sure that they application is running
properly in the newly deployed environment. (Atlassian, 2021)

Pros

 It helps in finding the bugs in the early stage of testing. (Tryqa, 2021)

17
  It helps in finding the issues that got introduced by the integration of components.
(Tryqa, 2021)
 It helps in verifying the issues fixed in the previous build are NOT impacting the major
functionalities of the application. (Tryqa, 2021)
 Very limited number of test cases is required to do the smoke testing. (Tryqa, 2021)
 Smoke testing can be carried out in small time. (Tryqa, 2021)

Cons

 Smoke testing does not cover the detailed testing. (Tryqa, 2021)
 It’s a non-exhaustive testing with small number of test cases because of which we not are
able to find the other critical issues. (Tryqa, 2021)

Black Box Testing

Black box testing involves testing a system with no prior knowledge of its internal workings. A
tester provides an input, and observes the output generated by the system under test. This makes
it possible to identify how the system responds to expected and unexpected user actions, its
response time, usability issues and reliability issues.

Black box testing is a powerful testing technique because it exercises a system end-to-end. Just
like end-users “don’t care” how a system is coded or architected, and expect to receive an
appropriate response to their requests, a tester can simulate user activity and see if the system
delivers on its promises. Along the way, a black box test evaluates all relevant subsystems,
including UI/UX, web server or application server, database, dependencies, and integrated
systems.

Pros

 Testers do not require technical knowledge, programming or IT skills

 Testers do not need to learn implementation details of the system
 Tests can be executed by crowd sourced or outsourced testers

18
Cons

 Difficult to automate
 Requires prioritization, typically infeasible to test all user paths
 Difficult to calculate test coverage

Tools available for user interface design and experience

Adobe XD
If agility is something Unilever Kenya desires in designing or creating prototypes, then Adobe
XD is a good option, because not only does it let them design but also share user interfaces and
experiences. With Adobe XD it’s smooth sailing for digital projects under its Creative Cloud
suite. Moreover, it’s the industry standard. If they’re new to Adobe’s XD however, they may
find its interfaces different from the regular adobe. However, it’s in competition with the leading
design tools in the market. (Citrusbits, 2021)

Pros:

 A clean interface
 With its repeat grid feature , Unilever Kenya don’t have to copy-paste or Ctrl+D things,
just select the group and adjust the grid when they want to replicate
 Can fill the UI by dragging and dropping content
 Saves time and energy
 With the entire suite and integration, they don’t have to pay for another software
 Works best on PCs and lets them design for PCs
 Adobe XD even supports UX design. (Citrusbits, 2021)

Cons:

 Originally, it wasn’t created for UI/UX design

 The subscription on a monthly basis, somewhat costly
 Some say it isn’t as mature as Sketch and InVision
 It’s very difficult to share with clients or colleagues (Citrusbits, 2021)

19
Sketch
Being able to make universal changes — whether it's through their library of symbols, layer
styles, or text styles, or its smooth resizing and alignment features — saves designers time to
deliver consistent prototypes. It takes out what’s tedious and lets designers jump in and create.
And with a multitude of third-party plugins that integrate without problems, there’s no shortage
of tools out there that can be used with Sketch. (Citrusbits, 2021)

It’s a vector-based design tool that focuses on on-screen design. Many mobile app designers and
developers use Sketch to design epic user interfaces for varying smart devices. With Sketch its
plain sailing. It offers a torrent of easy-to-use but powerful tools allowing both beginners and
professionals to design at their best. (Citrusbits, 2021)

Pros:

 Offering the essential web designer tools (it’s a12MB in comparison to Photoshop CS5,
which is 412MB)
 No font-rendering woes, it stays the same on the web
 Can design elements like icons etc and reuse them
 Collaboration platform
 The export codes let them refine and use their creations in other apps
 Built-in grids
 Autosave and multiple art boards
 Device-mirroring (you can mirror your designs on devices to test how they look)
(Citrusbits, 2021)

Cons:

 Can slow down the machine

 Doesn’t let them create permanent color palettes
 The learning curve makes them throw yourself out of their comfort zone
 Some say it isn’t user-friendly however, to each its own. (Citrusbits, 2021)

Marvel App
20
This mobile app design platform was created for everyone, not just app developers or designers.
Hence, its simplicity and user-friendly interface. Unilever Kenya can create first-rate prototypes
or mockups without hassle. (Citrusbits, 2021)

Pros:

 Easier to set up and work on

 User-friendly interface
 Cloud-based prototyping and wireframing
 Offers Plugins for sketch and Photoshop
 Let’s them share the URL in a single click, interested people can easily view it in their
browsers. (Citrusbits, 2021)

Cons:

 Costly and trial only allows 2 projects per user

 Doesn’t work offline
 Can’t animate mockup screens (isn’t the end of the world although) (Citrusbits, 2021)

UXPin
To fully appreciate a tool like UXPin, it’s important to understand the context in which it exists.
With the digital revolution rapidly changing the way we interact with the world around us, there
has never been a greater demand for well-designed products – both aesthetically and
functionally. The design processes that lead to product successes are both multidisciplinary and
complex. The tools you use should reflect that. In other words, if Unilever Kenya Limited design
process involves people from varying professional backgrounds, their tool should support that.

New wireframing and prototyping tools appear almost every day in the market but these tools
typically focus only on one part of the design and development process. InVision, for example, is
collaborative but not very powerful for creation. Axure, meanwhile, is powerful but not very
collaborative. UXPin aims to be the best of both worlds. (Interaction, 2021)

21
It’s precisely for this reason that UXPin’s integrative and collaborative approach to building
products stands out. UXPin describes itself as a collaborative platform for increasing the speed,
quality, and scalability of product creation and that’s exactly how it feels to use the platform.

The people who have built UXPin – and now continually evolve its capabilities – have the
advantage of 8 years of user feedback and market experience, and this shows in key areas. After
having spent time using UXPin, it seems they’ve resisted the temptation of “creeping featurism”,
i.e. cluttering their interface with more and more features. Instead, they offer a well-chosen set of
capabilities that makes the right tool handy at the right time for team members. (Interaction,
2021)

Pros

 Improved design consistency thanks to Design System Libraries and symbols

 Creative freedom in design and prototyping with lo-fi and hi-fi capabilities
 Intuitive comment tracking, design approvals, and project tracking
 Sketch, Google Fonts, and Slack integrations
 No redlining and minimal documentation needed thanks to Spec Mode (Interaction,
2021)

Cons

 Slight learning curve

 No birds-eye view of prototype screens
 No Illustrator integration (Interaction, 2021)

Axure RP
Axure RP is a powerful design tool for creating highly interactive HTML prototypes for web,
mobile, and desktop application projects. The RP in Axure RP stands for Rapid Prototyping
which is the core focus of the tool. Axure allows users to quickly create wireframes and
prototypes from any rough ideas they may have. (Uxswitch, 2021

The Pros of Axure

Good for Clients

22
All too often, static design documentation can prove difficult for senior level clients to penetrate.
They don’t have time to join the dots, to connect something on page 18 with a related item on
page 72 for example. Axure comes to the rescue by providing a clickable online prototype that
even the busiest of Executives can understand and comment on. However, there is a very closely
related Con to this, described later on. (Uxswitch, 2021)

A Holistic View

If Unilever Kenya have to design intricate controls and modules on a static tool like Visio, it can
be difficult to get a feeling of how they flow together as an interface. In contrast, Axure’s
comprehensive interactivity allows them to imagine exactly how the interface gels together.
Making for a better end product. (Uxswitch, 2021)

Time Saver

In Axure, Unilever Kenya can set up Masters to overcome this. They allow them to make one
change that persist everywhere. This is a huge time and frustration saver. (Uxswitch, 2021)

Adaptive Views

Axure allows Unilever Kenya to show what a design will look like in different screen sizes,
mobile, tablet and desktop. While not truly responsive, the content of the primary view is
conveniently inherited by the others to make things easier to create. (Uxswitch, 2021)

Really Realistic

Axure allows Unilever Kenya to style widgets and import their own libraries. They can achieve
both low and high fidelity prototypes, perfect for usability testing if required. (Uxswitch, 2021)

The Cons of Axure

Difficult to Follow

Axure prototype is not fully interactive and only certain paths through the demo interface work,
clients are likely to find it very difficult to follow. They tend to click around as if it were a fully
functioning product. Understandably so. This is the case even if Unilever Kenya document those
paths in the Notes that accompany the online prototype as clients tend not to read them.
(Uxswitch, 2021)

23
Learning Curve

There can be a steep learning curve in coming to grips with the ins and outs of Axure. Some of
Axure’s most impressive and useful functionality needs a great deal of skill and patience to
execute, such as Repeater Tables that allow Unilever Kenya to fake a database of backend. If
they have any experience with coding then they’re more likely to get how the software works.
They’ve seen accelerated learning in their team when there is a real project at hand and real
interactions to create in Axure. There’s something about deadlines that focusses the mind.
(Uxswitch, 2021)

Poor Transferability

If designers get moved between projects, it can be very difficult to understand another
designer’s Axure files, or even one’s own files after the passing of time. This is due to personal
workarounds and the sheer complexity of the designed interaction. (Uxswitch, 2021)

Not Quite Mobile

One would expect to build separate screens in Axure for separate screens that might exist on a
mobile app for example. However, doing so means that there can be a significant delay between
screen loadings. This feels glitchy. A workaround is to build everything on a single page
using Dynamic Panels. Initial loading time is longer but transition between pages is smooth.
(Uxswitch, 2021)

Printed Specs

Some clients still require printed versions of the interface specification. Creating a printed
version of a complex Axure prototype, one with a lot of dynamic panels for example, requires
much manual effort. This is because the built in Export features are pretty basic. This can be
frustrating and time consuming. (Uxswitch, 2021)

Impact of common user experience and interface design methodology in

the software development lifecycle.

Software Development Life Cycle (SDLC)

24
Software Development Life Cycle (SDLC) is a process used by the software industry to design,
develop and test high quality software. The SDLC aims to produce a high-quality software that
meets or exceeds customer expectations, reaches completion within times and cost estimates.
SDLC is a process followed for a software project, within Unilever Kenya. It consists of a
detailed plan describing how to develop, maintain, replace and alter or enhance specific software.
The life cycle defines a methodology for improving the quality of software and the overall
development process. (Tutorialspoint, 2021)

Traditional Software Development Methodology

Traditional software development methodologies are based on pre-organized phases/stages of the
software development lifecycle. Here the flow of development is unidirectional, from
requirements to design and then to development, then to testing and maintenance. In classical
approaches like the Waterfall model, each phase has specific deliverables and detailed
documentation that have undergone a thorough review process. (Kpipartners, 2021)

Traditional approaches are suited when requirements are well understood – for example, in
industries like construction, where everyone clearly understands the final product. On the other
hand, in rapidly changing industries like IT, traditional development procedures might fail to
achieve project goals. Below are the major disadvantages of traditional SDLC methods.
(Kpipartners, 2021)

 Problem statement / business need has to be defined well in advance. The solution also
needs to be determined in advance and cannot be changed or modified. (Kpipartners,
2021)
 The entire set of requirements have to be given in the initial phase without any chance of
changing or modifying them after the project development has started.

For example, the user might have given initial requirements to analyze their products in terms of
sales. After the project has begun, if the user wants to change the requirement and analyze the
data on the region-wise movement of products, the user can either wait till the completion of
initial requirements or start another project. (Kpipartners, 2021)

 The user cannot conduct intermediate evaluations to make sure whether the product
development is aligned so that the end product meets the business requirement.

25
  The user gets a system based on the developer’s understanding and this might not always
meet the customer’s needs.
 Documentation assumes high priority and becomes expensive and time consuming to
create.
 There are less chances to create/implement re-usable components.

These disadvantages hinder project delivery in terms of cost, effort, time and end up having a
major impact on customer relationships.

 Testing can begin only after the development process is finished. Once the application is
in the testing stage, it is not possible to go back and edit anything which could have an
adverse impact on delivery dates and project costs.
 Occasionally, projects get scrapped which leads to the impression of inefficiency and
results in wasted effort and expenditure. (Kpipartners, 2021)

Traditional development methodologies are suitable only when the requirements are precise i.e.,
when the customer knows exactly what they want and can confidently say that there won’t be
any major changes in scope throughout the project development. It is not suitable for large
projects such as maintenance projects where requirements are moderate and there is a great scope
for continuous modification. (Kpipartners, 2021)

Agile Software Development Methodology

Unlike the traditional approaches of SDLC, Agile approaches are precise and customer friendly.
Users/Customers have the opportunity to make modifications throughout project development
phases. The advantages of Agile over traditional development methodologies include:

 Though the problem statement/business need and solution are defined in advance, they
can be modified at any time.
 Requirements/User Stories can be provided periodically implying better chances for
mutual understanding among developer and user.
 The solution can be determined by segregating the project into different modules and can
be delivered periodically.

26
  The user gets an opportunity to evaluate solution modules to determine whether the
business need is being met thus ensuring quality outcomes.
 It is possible to create re-usable components.
 There is less priority on documentation which results in less time consumption and
expenditure. (Kpipartners, 2021)

Agile proposes an incremental and iterative approach to development. Consider Agile Scrum
Methodology to get good understanding of how Agile processes work. Scrum Master plays an
important role in Agile Scrum Methodology. A Scrum Master interacts daily with the
development team as well as the product owner to make sure that the product development is in
sync with the customer’s expectations. (Kpipartners, 2021)

Spiral Model
Spiral Model is a risk-driven software development process model. It is a combination of
waterfall model and iterative model. Spiral Model helps to adopt software development elements
of multiple process models for the software project based on unique risk patterns ensuring
efficient development process. (guru99, 2021)

Each phase of spiral model in software engineering begins with a design goal and ends with the
client reviewing the progress. The spiral model in software engineering was first mentioned by
Barry Boehm in his 1986 paper. (guru99, 2021)

The development process in Spiral model in SDLC, starts with a small set of requirement and
goes through each development phase for those set of requirements. The software engineering
team adds functionality for the additional requirement in every-increasing spirals until the
application is ready for the production phase. (guru99, 2021)

Pros

 Additional functionality or changes can be done at a later stage. (guru99, 2021)

 Cost estimation becomes easy as the prototype building is done in small fragments
 Continuous or repeated development helps in risk management (guru99, 2021)

27
  Development is fast and features are added in a systemic way in Spiral development
 There is always a space for customer feedback. (guru99, 2021)

Cons

 Risk of not meeting the schedule or budget. (guru99, 2021)

 Spiral development works best for large projects only also demands risk assessment
expertise. (guru99, 2021)
 For its smooth operation, Spiral model protocol needs to be followed strictly
 Documentation is more as it has intermediate phases. (guru99, 2021)
 Spiral software development is not advisable for smaller projects, it might cost them a lot
(guru99, 2021)

Iterative Model
An iterative life cycle model does not start with a full specification of requirements. In this
model, the development begins by specifying and implementing just part of the software, which
is then reviewed in order to identify further requirements. Moreover, in iterative model, the
iterative process starts with a simple implementation of a small set of the software requirements,
which iteratively enhances the evolving versions until the complete system is implemented and
ready to be deployed. Each release of Iterative Model is developed in a specific and fixed time
period, which is called iteration. (Professionalqa, 2021)

Furthermore, this iteration focuses on a certain set of requirements. Each cycle ends with a
usable system i.e., a particular iteration results in an executable release. Iterative Model allows
accessing previous phases, in which the changes are made accordingly. The final output of the
product is revived at the end of the Software Development Life Cycle (SDLC). Typically
iterative development is used in conjunction with incremental development, in which a longer
software development cycle is split into smaller segments that are built upon each other.
(Professionalqa, 2021)

Some working functionality can be developed and early in the software development life cycle
(SDLC). (Professionalqa, 2021)

28
Pros

 It is easily adaptable to the ever changing needs of the project as well as the client.
 It is best suited for agile organisations.
 It is more cost effective to change the scope or requirements in Iterative model.
 Parallel development can be planned.
 Testing and debugging during smaller iteration is easy.
 Risks are identified and resolved during iteration; and each iteration is an easily managed.
 In iterative model less time is spent on documenting and more time is given for
designing.
 One can get reliable user feedback, when presenting sketches and blueprints of the
product to users for their feedback. (Professionalqa, 2021)

Cons

 More resources may be required.

 Although cost of change is lesser, but it is not very suitable for changing requirements.
 More management attention is required.
 It is not suitable for smaller projects.
 Highly skilled resources are required for skill analysis.
 Project progress is highly dependent upon the risk analysis phase.
 Defining increments may require definition of the complete system. (Professionalqa,
2021)

Different end user categorization, classification and behavior modelling

techniques

Beginner user
Every user is beginner user at earlier phase of their life. To make beginner user to intermediate
designers, Unilever Kenya must ensure that the things they see and use UI to remain in their
mental models. The main usability of beginning users is their main focus area is on, menus &
messages. They tend to use above options hierarchical system architectures, reading all the labels

29
and understanding of location where specific options and features are placed. For dialogues and
notifications user may refer them slower, trying to understand them thoroughly. (Ques10, 2021)

Intermediate users
Intermediate users is always looking desired features and way to easily access them. Intermediate
level users will have some different requirements. The basic skill to operate them is already
known. As they are familiar with basics they will now find out new techniques to operate system
very effectively. Majority numbers of users are intermediates. Unilever Kenya will optimize user
experiences for intermediate as majority of users are inter-mediators. (Ques10, 2021)

Expert users
The number of expert users is always smaller than other type of users as they become expert by
longer experience and excellence skill set. This group of users becomes very important group of
users as they become expert. These group of users is very small but this effectiveness is very
high. Experts may know additional functionalities and abilities of systems to perform all tasks.
As it is expected that interface must help these users to more productive. Interface should be
definitely optimized for intermediates and help beginners to understand and helps beginners to
understand application but also be more productive for experts. (Ques10, 2021)

Categorizing Your Audience

A critical element of a good commerce site is a design built around a well-understood audience,
because the success of a site depends on meeting the needs and requirements of the people who
use the site. The audience for a web site isn't just a homogeneous group of identical people; even
with a small audience that shares very similar goals for using a web site, the individual end-users
will vary across a range of characteristics, understandings, priorities, etc. Understanding the site's
audience(s) requires some scheme for categorizing users into "chunks" whose needs and
requirements can be identified, managed and accommodated. (Philosophe, 2021)

Sites are designed by people, for people. For a site to fulfill the purposes behind its creation, the
site must attract and please its users. If a site is intended for or targeted to a particular type of
user, then the appeal and functionality of the site can be optimized for that type of user. The

30
other side of this view is that if a site is intended for a particular type of user, then an obvious
measure of the site's success is the extent to which this type of user's needs and desires are met.

Any categorization scheme must also take into account the point-of-view of the team that creates
it. A categorization will provide definitions of end-users and their associated characteristics,
goals, etc., but some definitions will have negative impacts on the user experience because the
definitions used by developers may not reflect a true user point-of-view. (Philosophe, 2021)

Categorizing Users by Role

A scheme for identifying users based on user roles or modes of interaction with the site is,
intuitively, more useful for understanding the site's audience.

Role-based user categorization schemes have several general shortcomings.

A role is a schema consisting of a self-view, a structured world paradigm, and a framework of

definitions, concepts and rules governing interaction with other roles, agents and objects. Any
definition of a role, or assignment of identity based on role, must be very well researched or it
risks being superficial and inconsistent. A role assignment that doesn't reflect actual behavior is
not helpful. Identifying a user as having the interaction behavior – and hence the role – of a
viewer doesn't address a.) What the person thinks about commerce in general, b.) What the
person thinks about the particular merchandise available on the web site, or c.) What it would
take to help the person make the decision to buy from the site. (Philosophe, 2021)

People play many different roles, often at the same time. Categorizing users by role must address
the determination of the primary role as well as the relative importance of the other roles being
played. (Philosophe, 2021)

Role definitions may be driven more from developer projections and expectations than from
actual user behavior. Roles that aren't based on observations of real users are not helpful and can
in fact be detrimental to the site's usability and its ability to meet its business goals. (Philosophe,
2021)

Categorizing Users by Knowledge/Experience Domains

General knowledge of and familiarity with computers

31
Users can be measured along a scale of familiarity with computers ranging from not at all
experienced to very experienced. (Philosophe, 2021)

Expertise in using the web site

Users can be measured along a scale of level of expertise using the web site, ranging from people
new to the site to people with great familiarity with the site. (Philosophe, 2021)

Understanding of the task domain

Users can be measured along a scale of their understanding of the kinds of tasks required or
available at the site. For example, a typical commerce site is essentially a store, a place to
purchase something, so there is a set of tasks commonly associated with commerce that should
be accomplishable on the site. A user who is very familiar with both commerce and online
commerce should have a better grasp on the relevant tasks than would somebody who is less
familiar with commerce. (Philosophe, 2021)

Categorizing Users by Shared Similarities

Any scheme for identifying users should be derived from observation of users, which means
looking for groups of users that share similar goals, desires, needs, abilities, and client-side
environments. The important thing is to group users based on properties that inhere in them, such
as their characteristics, and not in a web designer's expectation of them, such as predicted
behavior. Look for their real behavior. (Philosophe, 2021)

This level of information concretizes user trends and metrics into quantifiable components, and
groups users into sets of users. Once a set of users has been identified on the basis of an
observable trait or measurable data point -- for example, users who connect to the Internet via a
2800 baud or slower modem -- you have a more consistent identifier than one derived from a
functionality scheme or a role scheme. (Philosophe, 2021)

For example, an online bookstore will have a number of easily identified sets of users, including:

Users who have no interest in buying anything -- they just want to poke around or research
topics, authors, etc.

Users who have a desire to buy a specific book, and come to the site for that explicit purpose

32
Users who want to buy a gift for someone. (Philosophe, 2021)

BEHAVIORAL MODELS
When an analyst is attempting to understand the underlying application domain of a problem, he
or she must consider both structural and behavioral aspects of the problem. Unlike other
approaches to the development of information systems, object-oriented approaches attempt to
view the underlying application domain in a holistic manner. By viewing the problem domain as
a set of use cases that are supported by a set of collaborating objects, object-oriented approaches
allow an analyst to minimize the semantic gap between the real-world set of objects and the
evolving object-oriented model of the problem domain. However, as we pointed out in the
previous chapter, the real world tends to be messy, which makes perfect modeling of the
application domain practically impossible in software. This is because software must be neat and
logical to work. (Oreilly, 2021)

Creating behavioral models is an iterative process that iterates not only over the individual
behavioral models [e.g., interaction (sequence and communication) diagrams and behavioral
state machines] but also over the functional and structural models. As the behavioral models are
created, it is not unusual to make changes to the functional and structural models. In this chapter,
we describe interaction diagrams, behavioral state machines, and CRUDE analysis and when to
use each. (Oreilly, 2021)

BEHAVIORAL STATE MACHINES

Some of the classes in the class diagrams represent a set of objects that are quite dynamic in that
they pass through a variety of states over the course of their existence. For example, a patient can
change over time from being new to current to former based on his or her status with the doctor's
office. A behavioral state machine is a dynamic model that shows the different states through
which a single object passes during its life in response to events, along with its responses and
actions. Typically, behavioral state machines are not used for all objects but just to further define
complex objects to help simplify the design of algorithms for their methods. The behavioral state
machine shows the different states of the object and what events cause the object to change from
one state to another. In comparison to the interaction diagrams, behavioral state machines should

33
be used to help understand the dynamic aspects of a single class and how its instances evolve
over time15 and not with seeing how a particular use case or use-case scenario is executed over a
set of classes. (Oreilly, 2021)

As in the creation of the interaction diagrams, when we create a behavioral state machine for an
object, it is possible that we will uncover additional events that need to be included in your
functional model and additional operations that need to be included in the structural model, so
our interaction diagrams might have to be modified again. Because object-oriented development
is iterative and incremental, this continuous modification of the evolving models (functional,
structural, and behavioral) of the system is to be expected. (Oreilly, 2021)

INTERACTION DIAGRAMS
One of the primary differences between class diagrams and interaction diagrams, besides the
obvious difference that one describes structure and the other behavior, is that the modeling focus
on a class diagram is at the class level, whereas the interaction diagrams focus on the object
level. In this section we review objects, operations, and messages and we cover the two different
diagrams (sequence and communication) that can be used to model the interactions that take
place between the objects in an information system. (Oreilly, 2021)

Objects, Operations, and Messages

An object is an instantiation of a class, that is, an actual person, place, or thing about which we
want to capture information.

Each object also can send and receive messages. Messages are information sent to objects to tell
an object to execute one of its behaviors. Essentially, a message is a function or procedure call
from one object to another object. For example, if a patient is new to the doctor's office, the
system sends an insert message to the application. The patient object receives the instruction (the
message) and does what it needs to do to insert the new patient into the system (the behavior).
(Oreilly, 2021)

Sequence Diagrams

Sequence diagrams are one of two types of interaction diagrams. They illustrate the objects that
participate in a use case and the messages that pass between them over time for one use case. A

34
sequence diagram is a dynamic model that shows the explicit sequence of messages that are
passed between objects in a defined interaction. Because sequence diagrams emphasize the time-
based ordering of the activity that takes place among a set of objects, they are very helpful for
understanding real-time specifications and complex use cases. (Oreilly, 2021)

AN EXAMPLE OF A CUSTOMER JOURNEY MAP

Model chosen for Unilever Kenya

Iterative model
An iterative life cycle model does not attempt to start with a full specification of requirements.
Instead, development begins by specifying and implementing just part of the software, which can
then be reviewed in order to identify further requirements. This process is then repeated,
producing a new version of the software for each cycle of the model. In iterative model we can
only create a high-level design of the application before we actually begin to build the product
and define the design solution for the entire product. Later on we can design and built a skeleton
version of that, and then evolved the design based on what had been built. (Tryqa, 2021)

In iterative model we are building and improving the product step by step. Hence we can track
the defects at early stages. This avoids the downward flow of the defects. (Tryqa, 2021)

35
In iterative model we can get the reliable user feedback. When presenting sketches and
blueprints of the product to users for their feedback, we are effectively asking them to imagine
how the product will work. In iterative model less time is spent on documenting and more time is
given for designing. (Tryqa, 2021)

Iterative design is a methodology that positions your digital experience is a living project that
you should regularly tweak and improve upon as you go, rather than building it in one fell swoop
and being done for good. Unilever Kenya can think of the iterative design process as a
continuous cycle of prototyping, testing, and making adjustments and refinements. (Engines,
2021)

So rather than building an entire enterprise website from start to finish without any testing or
user feedback – like Unilever Kenya would do if they were using the traditional waterfall
methodology – iterative design is an ongoing, incremental process. (Engines, 2021)

One part of a digital experience is designed, created, and tested, and is built upon in future
designs. User testing and feedback can help Unilever Kenya understand which elements of their
site are working and which aren’t. It can also help them find the root cause to problems they
may know exist, but now know why they do. (Engines, 2021)

36
Unilever Kenya Limited Testing Methodology
Black box testing has its own life cycle called Software Testing Life Cycle (STLC) and it is
relative to every stage of Software Development Life Cycle of Software Engineering. The main
focus of black box testing is on the validation of your functional requirements. Black box testing
gives abstraction from code and focuses on testing effort on the software system behavior.
(Guru99, 2021)

Requirement - This is the initial stage of SDLC and in this stage, a requirement is gathered.
Software testers also take part in this stage.

Test Planning & Analysis - Testing Types applicable to the project are determined. A Test
Plan is created which determines possible project risks and their mitigation. (Guru99, 2021)

Design - In this stage Test cases/scripts are created on the basis of software requirement
documents

Test Execution- In this stage Test Cases prepared are executed. Bugs if any are fixed and re-
tested. (Guru99, 2021)

Black Box Testing is a software testing method in which the functionalities of software
applications are tested without having knowledge of internal code structure, implementation
details and internal paths. Black Box Testing mainly focuses on input and output of software
applications and it is entirely based on software requirements and specifications. It is also known
as Behavioral Testing. An operating system like Windows, a website like Google, a database like
Oracle or even your own custom application. Under Black Box Testing, you can test these
applications by just focusing on the inputs and outputs without knowing their internal code
implementation. (Guru99, 2021)

Black Box Testing Techniques

Following are the prominent Test Strategy amongst the many used in Black box Testing

Equivalence Class Testing: It is used to minimize the number of possible test cases to an
optimum level while maintains reasonable test coverage. (Guru99, 2021)

37
Boundary Value Testing: Boundary value testing is focused on the values at boundaries. This
technique determines whether a certain range of values are acceptable by the system or not. It is
very useful in reducing the number of test cases. It is most suitable for the systems where an
input is within certain ranges. (Guru99, 2021)

Decision Table Testing: A decision table puts causes and their effects in a matrix. There is a
unique combination in each column. (Guru99, 2021)

Unilever Kenya Limited User Interface Plan

Overview
With the current state of COVID-19, it would be ideal if Unilever Kenya would start selling
products online to satisfy their customers. This will stop the need for the customers to go out to
buy the products from the store when they can simply order it from the smartphone app that’s
within their reach

Aim
To create an interactive smartphone app that Unilever can use to display products that can be
sold to customer who are in need of products that are being sold. The app should help customers
proceed to the checkout with their items.

Objectives
 Providing quality products on the application
 Regularly adding new information
 Establishing trust
 Marketing Unilever Kenya site on social media.
 Active social media program
 Search engine optimization
 user-friendly site

Users
38
Anyone who has a smartphone will be able to access the Unilever Kenya app to become a
consumer and a regular customer. It is a kid friendly application that is catered to satisfying the
customer’s needs and wants

User requirement
The users will be required to fill in a log in form in. That way, they’ll be able to check out of the
application with the products that they’ve just bought with Unilever Kenya.

Type of interface
The design for Unilever will be a graphical user interface and a Form driven interface. This
user interface allows users to interact with electronic devices through graphical icons and audio
indicator such as primary notation, instead of text-based user interfaces, typed command labels
or text navigation.

A form driven interface invites the user to enter information into a series of form fields. Form
driven interfaces are used to enter step by step information that can be inserted into a database
for later use. Personal information being collected from users of the NIIMS portal will be done
using a form based interface.

Design tool chosen

MockFlow is a cloud-based wireframe software allowing designers to collaborate in real time on
user interface prototypes for websites and software.
MockFlow is an online wireframe software for designers planning, building and sharing work.
MockFlow provides users with a large library of mockup components, icons, stickers and other
shapes to quickly and efficiently build clean looking interface mockups. MockFlow makes real-
time design collaboration easy with its built in sharing feature and team chat.

Wireframe design

39
40
41
42
43
44
Controls used in the various wireframes
Buttons
A button is a graphical control element that provides the user a simple way to trigger an event.
Text fields
A text box, text field or text entry box is a graphical control element intended to enable the user
to input text information
Drop down lists
A drop-down list is a graphical control element that allows the user to choose one value from a
list. When a drop-down list is inactive, it displays a single value. When activated, it displays a
list of values, from which the user may select one
Date picker
A date picker, popup calendar is a graphical user interface widget which allows the user to select
a date from a calendar.
Radio Buttons
A radio button or option button is a graphical control element that allows the user to choose only
one of a predefined set of mutually exclusive options.
Labels
A label is a graphical control element which displays text on a form. It is usually a static control
having no interactivity. A label is generally used to identify a nearby text box or other widget.
Paragraph
A paragraph is a self-contained unit of a discourse in writing dealing with a particular point or
idea. A paragraph consists of one or more sentences. Though not required by the syntax of any
language, paragraphs are usually an expected part of formal writing, used to organize longer
prose.
Images
An image is a binary representation of visual information, such as pictures, graphs, logos, or
individual video frames.

Tools to develop Unilever Kenya Limited User Interface

Big Cartel

Big Cartel is an ecommerce builder that lets you make an online store for free. Suitable for
selling individual pieces such as artworks rather than bulk uploads due to its simple sales
features, BigCartel is good for small businesses who aren’t looking to scale up soon.
Beginners are supported by BigCartel’s user friendly onboarding process, with prompts and
reminders helping you set up your store.

45
But, to get the most out of this builder you will need to know how to code. Basic sales features
and a free plan make BigCartel a risk-free choice for starting your business out small.

Unilever Kenya Limited Iteration

This page shows the login page

46
Figure showing the front page of Unilever application

47
Figure showing the items that are on display in the feature page

48
Figure showing more information on the chosen product

Figure showing that the item can be added to the cart

49
Figure showing the items that have been placed in the cart and the price as well.

50
Figure showing the different option available when shopping on the application

51
Figure showing the interactive contact that customers can use to ask and receive questions
from the employees at Unilever Kenya Limited

End user experiment and feedback

A questionnaire was the method used for feedback collection. A questionnaire as an instrument
for collecting data, which almost always involves asking a given subject to respond to a set of
oral or written questions.
Questionnaires was the preferred choice of feedback collection because of the following reasons:
1. Questionnaires are inexpensive
Questionnaires are one of the most affordable ways to gather quantitative data.

52
They are a cost-efficient way to quickly collect massive amounts of information from a large
number of people in a relatively short period of time.
2. Questionnaires are practical
Questionnaires are a practical way to gather data. They can be targeted to groups of your
choosing and managed in various ways. You can pick and choose the questions asked as well as
the format i.e. open-ended or multiple choice. They offer a way to gather vast amounts of data on
any subject.
3. Questionnaires offer a quick way to get results
It’s quick and easy to collect results with questionnaires. This means that you can gain insights in
minutes depending on the scale and reach of your questionnaire.
4. Questionnaires offer Comparability options
When data has been quantified, it can be used to compare and contrast other research and may be
used to measure change.

The form used to collect feedback form the test users was as follows:
Please take in a few minutes to fill in the questionnaire
A sample of a questionnaire on user interface and user experience for Unilever Kenya Limited
We would appreciate your contribution towards the questionnaire that is provided below.

Note: Use X or tick to fill the boxes where applied

1. Gender?
Male  (  )          Female  (  )

2. What type of user are you? (Interaction with interfaces) 

Little Interaction (Novice) (  )
Medium Interaction (Intermediate (  )
Lots of Interaction (Expert) (  )

3. Does the UI meet the requirements?

Yes  (  )            No  (  )

4. Do you find the system user friendly?

Yes  (  )            No  (  )

53
 5. Is there any changes that you would like to be changed and improved?
Yes  (  )            No  (  )

If yes, please state what changed have to be made.

Thank you

End user feedback evaluation

Data analysis
Data analysis is a process of inspecting, cleansing, transforming and modeling data with the goal
of discovering useful information, informing conclusions and supporting decision-making.

Feedback analysis
The method of collecting feedback is through a questionnaire for Unilever Kenya interface.
There was a total of 5 questionnaires that were handed out and the responses or feedback
provided are analyzed.

Response Rate
From a total of 5 questionnaire issued all the responders responded which indicates a 100%
response rate. 
Number of questionnaires that were distributed

Distributed questionnaires 5

Returned questionnaires 5

Not returned questionnaires 0

54
Evaluation of the end user feedback

The response rate to the feedback was 100% meaning that the end users were able to
participate

Above are the ages of the users that participated in the feedback, they’re ranging from 18
to 32

55
The gender of the end users was 50% female and 50% male making it equal

This shows that 20% of the users were novice, 30% were experts and the majority were
intermediate with 50%

56
100% of the user feedback states that the customer liked what they saw and didn’t ask for any
changes to be made to the application design.

Unilever Kenya Limited iteration change

There were no changes made to the application seeing as the feedback that the app got was a
good one and there was no need to make any changes. The end users seemed to have been
satisfied.

Conclusion
The final design was a go ahead and it’s improved since the first design. There are more
information available, the links for the social media work and can connect the customers to the
official pages for Unilever. The contact page is to help customers with questions and they would
be gotten back to as soon as possible. The descriptions of the products is to help the customer get
more information on the product that they’re buying. Some of the products are listed for sale and
can be bought at a much lower price than intended on the application in the beginning. The app
was a success and no changes were implemented on the final iteration design. There was a lot of
changes made for the app from the first prototype to the now iteration design.

57
Test plan
A test plan is a document describing the scope, approach, resources and schedule of intended test
activities. The test plan document is derived from the product description, the software
specification SRS or the use of case documents.  Test planning is very important, essential and
crucial part of the test life cycle. Well planned and executed test ensures good quality software.
The test plan serves as a blueprint to conduct software testing activities as a defined process
which is minutely monitored and controlled by the test manager.

The goal of the test plan

The goal of the test plan is to ensure that the requirements. The most important goal for Unilever
Kenya Limited is to enable efficient products to their customers

The scope of the test plan

The scope of this test plan is to make sure that all the requirements are met and developed for
Unilever Kenya Limited. We also need to make sure that all types of users have all the relevant
feedback help and instructions required to enable them to use the interface without training and
help from other personnel. This test plan will also ensure that there are no bugs or errors and that
Unilever Kenya Limited is fully functional and it is compatible with all the different
smartphones.

Objectives 
The main objective of the test plan is to provide a fully functional smartphone app that is
compatible with all smartphones so that the customers can register with Unilever Kenya Limited
at any given place and time as long as they have an internet connection and a modern browser.
Some of the features that Unilever Kenya Limited can provide

 To enable registration of new users

 Ensure the interface is simple and easy to use UI
 Allow users to register online with the their smartphones
 To make sure everyone is able to understand and ensure that the phone app is accessible
to everyone who is in Kenya

58
  To ensure the application is user friendly for the target user group i.e. Novice users.

Test Pass/Fail Criteria

Test procedures should detail each test step. They must indicate what requirement (or partial
requirement) is being verified; what action, event, or condition must occur to execute or
complete the test step; and what is the expected outcome or response to that action. The expected
result (outcome or response) is the pass/fail criteria for that step. If the test step was executed and
the expected result did occur and was either witnessed or recorded and can be confirmed, then
that test step can be considered to have passed, and the test step's requirement is verified. If the
test step could not be executed or was executed and the expected result did not occur, was not
witnessed, or cannot be confirmed from the record, then that test step must be considered to have
failed and that requirement not verified. Any outcome other than the expected one should be
considered an anomaly or error (i.e., failed). (Fhwa, 2021)

Beware of transient conditions. Testing is an important aspect of system acceptance

and everything that happens during the test counts. Hence, all test participants must be focused
on the testing operation. With today's complex systems, it is not unusual for "strange" things to
happen that are not repeatable. For example, as the operator is performing a test, a specific
screen appears to show a non-existent error which does not re-appear when the screen is
refreshed. Was this an error or anomaly? At this point, the system might be considered suspect
and the tester may want to repeat the step (to confirm the final condition). Be sure to log this type
of event and file a report. Although it may not re-appear during the testing, it may provide a clue
to some other unrelated problem experienced later. At the very least, the vendor should be
required to explain what and how it could have occurred. (Fhwa, 2021)

Below is Test Pass/Fail Sheet

Test Pass/Fail Sheet (Tick as per result)

Test Criteria Pass  Fail Comments
No:
1. Form validation

2. Toggles are working correctly

59
 3. Is the interface responsive across different screens and
resolutions
4. Do all the buttons and links work

5. Does the interface show appropriate feedback messages

e.g. Success on form submission
6. Does the interface provide relevant help and contact
information
7. Does the interface capture user details

Below are the answers to Test Pass/Fail Sheet

Test Pass/Fail Sheet (Tick as per result)

Test Criteria Pass  Fail Comments
No:
1. Form validation  Success

2. Toggles are working correctly  Success

3. Is the interface responsive on the smartphone?  Success

4. Do all the buttons and links work  Success

5. Does the interface show appropriate feedback messages  Success

e.g. Success on form submission

6. Does the interface provide relevant help and contact  Success

information
7. Does the interface capture user details  Success

Critique of the overall success of Unilever Kenya Limited user interface

concept and insight using prototyping

The Unilever Kenya interface was concluded a success being that all the tests passed
successfully and all the improvements suggested in the feedback and end user testing phase were
successful. The interface provides readily available help information for the target end user
group i.e. Novice users and provides relevant feedback for the fields being edited by the users.

60
The user interface makes great use of the colors and themes to guide the users from the
homepage to the registration form thus ensuring the user is guided throughout the whole process.

Using design and prototyping is a way to enhance the user interface to ensure that the process of
creating the Unilever Kenya interface was an easy with changes being implemented from the
original prototype. This interface was a success because it got great feedback from the end users.
This accelerated the whole interface development process and the result was a responsive, useful,
accessible and usable portal interface. The project can thus be concluded a success.

61
References
W3computing.com. 2021. Types of User Interface. [online] Available at:
<https://www.w3computing.com/systemsanalysis/types-user-interface/> [Accessed 22 July
2021].

geeksinux. 2021. The Elements of User Experience Design | geeksinux. [online] Available at:
<https://www.geeksinux.com/the-elements-of-user-experience-design/> [Accessed 22 July
2021].

Atlassian. 2021. The different types of testing in software | Atlassian. [online] Available at:
<https://www.atlassian.com/continuous-delivery/software-testing/types-of-software-testing>
[Accessed 22 July 2021].

Citrusbits.com. 2021. [online] Available at: <https://www.citrusbits.com/app-designing-tools-

comparison-with-pros-and-cons/> [Accessed 22 July 2021].

The Interaction Design Foundation. 2021. A Review of UXPin – A Collaborative UX Design

Tool. [online] Available at: <https://www.interaction-design.org/literature/article/a-review-of-
uxpin-a-collaborative-ux-design-tool> [Accessed 22 July 2021].

UXswitch. 2021. Axure – The Ultimate list of Pros and Cons by Orla Walsh. [online] Available
at: <https://www.uxswitch.com/axure-the-pros-and-cons/> [Accessed 22 July 2021].

Team, K., 2021. Traditional vs. Agile Software Development Methodologies. [online]

Kpipartners.com. Available at: <https://www.kpipartners.com/blog/traditional-vs-agile-software-
development-methodologies> [Accessed 22 July 2021].

Guru99.com. 2021. Spiral Model: When to Use? Advantages & Disadvantages. [online]

Available at: <https://www.guru99.com/what-is-spiral-model-when-to-use-advantages-
disadvantages.html> [Accessed 22 July 2021].

Professionalqa.com. 2021. Iterative Model: Advantages and Disadvantages |Professionalqa.com.

[online] Available at: <https://www.professionalqa.com/iterative-model> [Accessed 22 July
2021].

62
The QA Lead. 2021. Unit Testing: Advantages & Disadvantages. [online] Available at:
<https://theqalead.com/topics/unit-testing/> [Accessed 22 July 2021].

Rana, K., 2021. Integration Testing | Types, Challenges, Benefits and Tools. [online]
ArtOfTesting. Available at: <https://artoftesting.com/integration-
testing#Challenges_in_Integration_testing> [Accessed 22 July 2021].

Parashchenko, R., 2021. Functional testing and its advantages and disadvantages. [online]
Strongqa.com. Available at: <https://strongqa.com/qa-portal/knowledge-base/testing-
types/functional-testing> [Accessed 22 July 2021].

Linkedin.com. 2021. End to end testing. [online] Available at:

<https://www.linkedin.com/pulse/end-testing-aditi-mulay> [Accessed 22 July 2021].

Invision Custom Solutions Inc. 2021. 6 Software testing methodologies and their pros & cons|
Toronto| Canada. [online] Available at: <https://www.invisionsolutions.ca/6-software-testing-
methodologies-and-their-pros-cons/> [Accessed 22 July 2021].

Testbytes. 2021. Software Performance Testing - Types, Benefits & Challenges. [online]

Available at: <https://www.testbytes.net/blog/software-performance-testing-types-benefits-
challenges/> [Accessed 22 July 2021].

Level, I., Manager, I., Tutorial, A., Tests, I., Us, C., Policy, P., Use, T. and Us, A., 2021. What is
smoke testing? When to use it? Advantages and Disadvantages. [online] Tryqa.com. Available
at: <http://tryqa.com/what-is-smoke-testing-when-to-use-it-advantages-and-disadvantages-2/>
[Accessed 22 July 2021].

operation., W., 2021. What are the three categories of the users? How they can be provided with
facilities to ensure feasibility in operation.. [online] Ques10.com. Available at:
<https://www.ques10.com/p/43571/what-are-the-three-categories-of-the-users-how-the/>
[Accessed 22 July 2021].

Philosophe.com. 2021. Categorizing Your Audience — philosophe.*. [online] Available at:

<https://www.philosophe.com/archived_content/understanding_users/categorizing_users.html>
[Accessed 22 July 2021].

63
O’Reilly Online Learning. 2021. Systems Analysis and Design with UML, 4th Edition. [online]
Available at: <https://learning.oreilly.com/library/view/systems-analysis-
and/9781118037423/11_chapter006.html#ch006-sec007> [Accessed 22 July 2021].

Enginess.io. 2021. What is Iterative Design? (and Why You Should Use It) | Enginess Insights.
[online] Available at: <https://www.enginess.io/insights/what-is-iterative-design> [Accessed 22
July 2021].

Level, I., Manager, I., Tutorial, A., Tests, I., Us, C., Policy, P., Use, T., Us, A., shiferaw, G. and
Verma, V., 2021. What is Iterative model- advantages, disadvantages and when to use it?.
[online] Tryqa.com. Available at: <http://tryqa.com/what-is-iterative-model-advantages-
disadvantages-and-when-to-use-it/> [Accessed 22 July 2021].

Guru99.com. 2021. What is BLACK Box Testing? Techniques, Example & Types. [online]
Available at: <https://www.guru99.com/black-box-testing.html> [Accessed 22 July 2021].

Ops.fhwa.dot.gov. 2021. FHWA Operations Error Feedback. [online] Available at:

<https://ops.fhwa.dot.gov/publications/tptms/handbook/chapter_9.htm'> [Accessed 22 July
2021].

64