1.
2Secure is in the process of creating a back
office system to manage all orders and packages
from their clients. They have general
functionalities to add clients, manage invoiced
orders. Now they need to develop a website to let
users can view all packages which are created by
back office system, My final deliverables were a
prototype to show back office and client web how
to work.
Project overview:
Gathering data:
2Secure provide IT security solutions and support
clients across a broad spectrum of industries. A
lot of invoices need to be processed among staff
who work with the back office. Currently the back
office not easy to find order and not clear user
interface to understand.
After a few rounds of discussion with the
technology leader of back office system. I made a
list of requirements for beta version so that they
can show to 2Secure how to work and discuss
next phase.
2Secure

2.
Analysing data:
When I began the project, I have experienced the back office system to understand functionalities
and user interface. I found a problem is really hard for users to quickly know the status of payment.
And when I create new package, not friendly input validation and package properties is fixed not
flexible to choose by administrator.
Another feeling is not clear category between package and order fields in main web page. Therefore,
I sketch a few solutions based on the problems I found and discuss with the tech lead as well. After a
few meetings, we have a initialize ideas about the project.

3. Final design:
As noted above, I have 2 priority needs: First, improve an easier portal for back office system to view all orders and add packages.
Secondly, design a wireframe for clients to manage own orders.
Admin portal:
- manage packages and orders
- check order status

4.
Customer portal:
- check packages and orders
- check own order status

5.
GolfSkiWorld
Project overview:
GolfSkiWorld is a commerce
information app for users who
interest in play golf and ski. User
can quickly find related deals, last
minute using the app. My role is
mobile app designer to design the
whole app UX/UI.

6.
Gathering and analysis data:
In the business plan, GolfSkiWorld defined the target group as people who live in Sweden, Finland and Norway(Since gold and ski is
very popular sport in North Europe). Even though they are common sports for local people but it is not easy for people to find good place
or price. Since I have worked in similar app before which name is - GolfInMobile so I have some ideas how should be looks like. To get
more valuable data from clients, we conducted focus group in the early days. In a focus group, users have different backgrounds, such
as business manager, tech lead and programmer, and the age range is 24-55 years old. We put some questions to let them to discuss to
share different ideas and observe them so that get more important information.
Ideas!
GolfInMobile web UI flow

7. Final design:
Based on requirements we discussed and found from other competitor products, I have designed version1.0 to client to test and
evaluate. I reused some ideas from GolfInMobile app like main workflow. In the landing page user can choose which theme they want to
go, in this version only golf and ski but maybe later will be more come in (depends on business objectives). The key functions is to show
deals, last minute and social network. The aim is to give users easy eyes to see how to find best golf and ski information in less time.
Due to business consideration, we add social network features inside using both 3td party plugins such as Facebook, Twitter and local
database, users can share and discuss their photos, videos and comment to others.

8.
Show valuable deal
and last minute on
map
Check last minute with
a one-click
View the details what
you choose from the list
User share their photo
and videos with others
User reviews to
products

9. Stockholms Stad
Project overview:
Stockholm stad is an official government website in Stockholm, it provides users information and E-services who travel or live
in Stockholm. They have a project - child summer camp reservation system that parents can easily book camp for their children
in time.
My task is to improve some parts of the website in an attempt to improve ease of use and usability.

10.
Gathering information:
• Interview users
• Target group
• Users needs
We spent one day to discuss at the office
with the project lead and other staff who
work with the project. The 3 points:
interviewing users, target group and users
needs are main lines of this meeting.
Interviewing clients or persons who work
with the project is a great way to collect
valuable data in the early of a project.
They have clear ideas and advice what
they think need to change or improve. A
full day of collaboration with relevant staff
in helping me understand the goal and the
problem.

11. Iterative design:
I designed 3 prototypes in select camp part of the project, after each design I conducted an usability evaluation or discussion to see what new things
can be improved:
1. The first design is focus in how to make a easier and clear UI, but after first discussion clients want to more simplify the “Choices” page.
2. Then the second design is more in choices part, I tested other similar websites to see what we can use and where we can improve based on exist
products. The second usability evaluation is much better than first one but we try to make it more easier to use, especially how to change choice
order in most easiest way.
3. Therefore, last design is more explain on the workflow logic of how to choose camp and how to order it.
First design: the purpose is to simply the user interface.

12.
Second design:
the purpose is to improve
the choices feature, to
make ease of use.

13. 1. Show the list of table based on date initially.
2. Family income filter: quick click based on average family income -
45,000 SEK or input free text to search.
3. Date filter: quick click within 2 weeks or choose specific period.
4. School year filter: quick click based on the school year of kids.
Third design: this design is based on second one to improve, the second design don’t have an easy way to sort camp choices, users have to back to
table list to check the position of choices. Therefore, the third design add a section under the table list section for showing all selected choices, and
users can dragged or delete as they want.

14. 5. Sort choice: selected camps are saved in the section as green one
shows, which can be dragged or deleted.
6. Sort choice: sorting camp choice by dragging to square position as
purple one shows.
7. Input validation: friendly input validation or tips give users better user
experience.
8. UX/UI improvement: Too many inputs give users messy feeling so
keep user interface clean, hide non mandatory input as possible.

15. Project overview:
Zinzino Balance App helps user with their goal to become balanced in
accordance to given recommendations concerning Omega-3 &
Omega-6 fatty acid levels. The application supports user with
reminders to take your daily dose of Balance Oil in accordance to
your personalized recommendation. You will be able to access
educational videos in the field of nutrition and the fatty acid balance.
My role in this project is interaction designer and mobile app
developer (Android & IOS).
Zinzino

16.
Gathering & analysis data:
I started to work with Zinzino from the beginning of 2015 for 1 year. In the beginning Zinzino company they have an initial idea is reminding users to
take Omega daily and motivate users to check health levels to achieve their goals. Zinzino had conducted focus group and workshop with their
existed users already. Therefore, I remotely work with Zinzino project group to create a specification directly and after a few discussion and
meetings, we got more ideas from their group and clients after each round.
Result

17.
App UI flow
The following use cases / functionality have been implemented, and are
described in more detail further down in the documents.
• Start App - App opens for first time – Show start pages to introduce the
user
• Intro
• Sign in using Facebook or Enter Customer ID or register
• Enter start test details
• Show videos page
• Start App - App opens for a logged in user
• Silent: Reschedule notifications
• Check if App User ID has not registered the unit yet, if not Call
server ServerOp: register user
• Retrieve steps, show in app
• Show Logged In Start page
• Start app – App opens from background / sleep mode
• Retrieve steps, show in app
• Verify app unit is registered on the server
• Show Logged In Start page
• Popup question: “Did you take your balance oil?”
• Answer yes in app, add point(s), update server with values
• Answer No in app, popup is closed, however pops up again
• Answer snooze in app Select time for now reminder, press
snooze, The notification is triggered at the selected time
Use Cases

18.
Prototype & Implementation:
My work was Android app development at that time, and after that I continue to engage in IOS development as well. Zinzino design team had
designed the prototype based on our specification and their group’s ideas.

19. The key features is motivating users
check their daily health points to
achieve the higher level. Users can
receive notification every day and
the alarm time is customized by
themselves, users can free to
choose ignore it or not (notification
alarm trigger once per day so never
disturb users all the time).
To encourage users to use the App
actively, Zinzino provides users
bonus if users can complete health
points in different phases. Basically,
Zinzino sets 5 levels and each level
is much harder than former level to
reach, but if users reach higher
level then they can receive more
interesting news and gifts from
Zinzino company.
In additional, we also design and
develop step counter to track users
daily steps, users can get one more
point if over 7500 steps per day
instead of only take Omega Oil to
earn points.
After the App released, we see
existed clients more active and
proactive to take Omega Oil and
upload their daily steps, the positive
result is more new users are
recommended by existed users to
start use the App.

20. RAMP - Risk Management tool for manual
handling Proactively
Overview:
RAMP is a R&D project, which is a
collaboration between KTH, Arla Foods,
Scania and some smaller companies, has
the objective to develop, implement and
disseminate an IT- based assessment tool
for physical ergonomics designated to
assess work and provide a structure to find
and take appropriate actions when needed.
My work is design and develop the
program.

21. Workshop:
In the beginning of the project, we
conducted workshop and daily meetings
with KHT STH researchers, Phds and Arla
managers who work with this project.
They had started the project for few years
already but they do not have any program
to test, so users have to answer some
questions in Excel forms without any
further results suggest. In the first week,
we have daily meetings to understand
their research purpose and discuss what
problems they want to solve. Basically,
the program should include 2 assessment
screening tests:
1. Checklist for screening physical risks
for manual handling.
2. In depth analysis for assessment of
physical risks for manual handling.
The core future is the program should
calculate each assessment based on
specific algorithms and factors to
generate risk result. The result helps
companies and industries to know how to
avoid high risk and take safety measures
in the early stages.
The risk result should be filter by different
companies and levels, and provide action
plans for companies according to the level

22.
Prototype testing:
I created a specification after the first session
week, and then I designed a general program
prototype for the first assessment to present in
the meeting. We went through the all functions to
see what new findings or something missing. The
prototype is a web-app which can be clicked by
users. The all tested users belong to this projects
with different background like business,
marketing, ergonomics.
But no one is good at technology so that is why I
would like to present the prototype which give
them an overview the program user interface.
During the meeting, they behaved more active
and create more good ideas. And then I used the
same way to conduct the second assessment
workshop.
Implementation:
After the final prototype was made and tested, I
started to design the database and development
work. One Phd of the team had database
experience so we worked together with the
database design in the beginning of
implementation process.

23. Usability testing:
On the web, usability is a necessary
condition for survival. We planed to
conduct an usability testing at KTH STH
laboratory and invite 5 users who
comes from different companies and
one of them is ergonomic professional
at STH. Some of them are very familiar
with the program and some of them
don’t have any pre-study about this
program.
I have designed few tasks and
questions to users to complete and
answer. The testing is a quality attribute
that assesses how easy user interfaces
are to use.
The testing result showed that the web-
app is easy and clear to learn and use,
users can easily find where they are but
the function of choosing result level is
not very easy for user to understand if
there are a lot of companies registered
the system then it will take much longer
time, so we got a lot of useful advice
from users about improvements like:
• Designing assessment type to
ongoing, open and closed.
• User has own profile to select
themselves assessment and check
result directly.
These feedback are very valuable for us to make the program better in next version. If budget allowed, more usability testing and evaluation can bring
more ideas and companies will benefit from it as well.