(BSC-IT17005) Human Computer Interaction Laboratory
Practical 5
Aim: Carry out the case study of any three user interface building and evaluation tools. Further, you will
use one of these tool for implementing the prototype of the interface.
Case Study based on given points and format:
Give Screenshot of every user interface building and evaluation tools.
MockFlow
Learnability
1. Easy to learn and use
because it allow us to
create pages which
makes it
amazingly simple to
create wireframes for
everyone. Also they
have plenty of templates
and elements that makes
your work easy and
standardized.
Usage 1. Clean and Simple
interface.
2. Sharing prototype is
simple.
3. Enhanced collaboration.
Fidelity 1. Mockflow is an
interactive wireframing
tool that lets users create
low-fidelity mockups as
well as
high fidelity prototypes
of website development
platform.
RapidUI
1. RapidUI is not that
much easy to learn as
compred to others
because it has more
features for designers
and developers who
have prior knowledge
of websites.
1. RapidUI is a design-to-
web tool that enables
users to transform
design files into live
websites. The tool
relies on automated
front-end development
which allows designers
to convert their work
into fully-functional
websites minus even a
single line of code.
1. The rapid
UI prototyping design
process may seem like
a cure-all. ...
committing to create
and deliver designs
with higher levels
of fidelity.
Mockplus iDoc
1. Mockplus iDoc is
easy to learn as
MockFlow, which is
one version with easy
to handle interface to
build your content.
1. It allows you to
upload your
wireframes and visual
designs from PS,
Adobe XD, and
Sketch, and add them
to your project folder
in iDoc.
2. it allows mobile
designers to handoff
designs with accurate
specs, assets, code
snippets and
interactive prototypes
automatically.
1. Mockplus iDoc is a
wireframing and low-
fidelity prototyping
tool with a relatively
simple learning curve
and support for
Windows, macOS,
iOS and Android.
With over 200 built-
in components and
3,000 icons to help
you build mockups
quickly, Mockplus is

Features 1. Independent Page
Management.
2. Plenty of customization
options.
3. A range of Pre-Made
Themes.
4. Various Exportation
options.
Professional 1. Not so great skills
skill required but does work
for non-technical users
required
2. All in all WireFramePro
is a good software
especially
for beginners and make
things very easy for
a beginner instead of
wasting time creating
elements one can just
pick it up form the pre
set element list..
Methodology 1. MockFlow is a complete 1. RapidUI is intended to
imposed UI planning suite with
or advice tools to visualize
interfaces, plan IA,
document styles,
approve designs,
illustrate screenshots and
more. Plan and design
better user interfaces
together within a single
suite. 2. The design process via the
2. MockFlow StyleGuide is
a design tool for crafting
brand pages and design
guidelines for your
business. StyleGuides
help designers to
document what they
create. Documenting
designs makes it easy to
iterate, share and
manage specs.
Communicatio 1. MockFlow being a cloud
n with based software provides
other built-in sharing in all its
subsystem apps. Generally projects
in MockFlow can be
1. Interactive design
2. Animations &
interactive elements
3. Hosting
4. Generate code
automatically.
1. Coding skills required
to know what’s the
generated code is ?
2. Otherwise it’s good
enough to handle if you
don’t have any coding
skills.
provide a web design
system and tools, that
enables its users to build,
design and manage
professional HTML
websites (each a "Site"),
with or without writing
code (the "System").
System, will be provided
to you, in accordance with
the terms indicated in the
package that will be
chosen by You via the
Website as well as other
conditions that may be
incorporated therein, from
time to time.
1. RapidUI allows users to
host their websites
directly from their
interface.
2. RapidUI provide
a fairly solid rapid
prototyping solution
for teams using a
range of devices and
operating systems
1. Gesture interaction
2. Double-click a layer
to create an
interaction.
3. Drag & drop a folder
or zip to upload.
1. Build a UI prototype
& Make designs
functional.
2. Communicate with
designers & Get
involved in the
project.
3. Build a good page
structure.
1. View tiny details of
specs.
2. Various ways of
accessing specs.
3. Tailored resources, all
in one place.
4. Show relations in full
view storyboard.
1. Export designs with
one click from
Sketch, Adobe XD,
and Adobe
Photoshop.
 shared in two ways. facility to add your 2. Collect and organize
2. Projects can be securely custom domain. style guides
and privately shared 3. RapidUI also accepts automatically to build
with specific users. the files from your team’s design
With private sharing, photoshop which are repository.
users can be given .psd files, It also
permissions to edit the resolves the psd files
project / review the into webpage.
project / be an admin of
the project. But the
shared user should have
at least a free basic
account at
MockFlow.com.
Extensibility 1. Product extensibility des 1. RapdiUI is great in part 1. Flexible workflow
and cribes how easy it is to of extensibility because make collaboration
Modularity expand a product’s it almost do lot of stuff more efficient.
feature set. An related to other 2. Add overlay methods
extensible product has application platform. to optimize the
been designed from its 2. It also has nice modular gestures sync effect
earliest stages for structures which gives which done by great
customization and several modules for moularity.
enhancement. Extensible coding & designing.
products are designed
for ease in expanding
your installation’s
feature set, enriching
current features, and
integrating with third-
party software.
2. Modular architectural
principles that guide
product structure.

MockFlow :

RapidUI :
MockPlus iDoc :