exam report - zlatkarizova.comzlatkarizova.com/images/exam-report-final.pdf · team gghz: team...
TRANSCRIPT
Team GGHZ: Team Coach:
Georgeana Panturu Anne – Marie Justinus Stærmose
Gintarė Jankūnaitė
Hristina Dimitrova
Zlatka Rizova
December 2017
Exam Report MMD 2nd Semester
1. Links to each group member’s website:
http://georgeanapanturu.com/IriJewellery/index.html Georgeana Panturu
http://amberdream.dk/exam2017/index.html Gintarė Jankūnaitė:
http://hrissi.com/exam2017/index.html Hristina Dimitrova
http://zlatkarizova.com/works/IriJewellery/index.html Zlatka Rizova
2. Link to GitHub Repository
https://github.com/giintaare/Exam
3. Trello
https://trello.com/examproject10
4. Number of keystrokes and standard pages
Keystrokes: 41 756 (only the main part of the report)
Standard pages: 18
5. Authors of different sections
Georgeana Panturu: Business Insights
Gintarė Jankūnaitė: Interaction
Hristina Dimitrova: Summary, Introduction, User Tests, Communication,
Conclusion
Zlatka Rizova: Visualization and User Tests
Table of Contents
I. Summary ................................................................................................................ 4
II. Introduction ......................................................................................................... 4
Artist’s Identity Profile .................................................................................................................................. 4
Problem Area .................................................................................................................................................. 4
Problem Formulation ................................................................................................................................... 5
III. Business Insights .................................................................................................. 5
Market research ............................................................................................................................................ 5
Business environment and external factors .................................................................................... 6
Competitor analysis ..................................................................................................................................... 7
Mission, vision and values ....................................................................................................................... 10
Business model canvas ............................................................................................................................ 10
SWOT .................................................................................................................................................................. 12
TOWS .................................................................................................................................................................. 13
IV. Communication .................................................................................................... 14
Initial user research .................................................................................................................................... 14
User tests .......................................................................................................................................................... 16
5 second test result and conclusion ................................................................................................. 17
V. Communication plan ........................................................................................... 20
Purpose, objective goal .......................................................................................................................... 20
Effect .................................................................................................................................................................. 21
Message ........................................................................................................................................................... 21
Sender ............................................................................................................................................................... 21
User profile ...................................................................................................................................................... 22
Customer Journey ...................................................................................................................................... 23
Digital media ................................................................................................................................................. 26
SEO ...................................................................................................................................................................... 26
USP & ESP ......................................................................................................................................................... 27
VI. Visualization ........................................................................................................ 28
Design brief .................................................................................................................................................... 28
Artist profile ..................................................................................................................................................... 28
Internal approval process ...................................................................................................................... 29
Technical Constraints ............................................................................................................................... 29
Design Process .............................................................................................................................................. 30
StyleTile .............................................................................................................................................................. 34
Design program ........................................................................................................................................... 36
Video ................................................................................................................................................................. 38
VII. Interaction ........................................................................................................... 38
The process..................................................................................................................................................... 38
VIII. Tests on developed prototype ............................................................................. 43
Krug’s Trunk Test ........................................................................................................................................... 43
Heuristics inspection .................................................................................................................................. 44
IX. Conclusion ........................................................................................................... 45
X. Reference ............................................................................................................. 46
XI. Appendix .............................................................................................................. 47
Sketches ........................................................................................................................................................... 47
Mood board .................................................................................................................................................. 49
Wireframes ...................................................................................................................................................... 50
Mock ups ......................................................................................................................................................... 52
Design examples ......................................................................................................................................... 53
Design manual ............................................................................................................................................. 56
Test results ........................................................................................................................................................ 60
WordPress guide .......................................................................................................................................... 68
EXAM REPORT – IRI JEWELLERY 4
Summary
The following report represents the whole process, argumentation and final solution of
the exam case assignment `Develop the Online Presence of an Artist´. The flow of the
report is following the logic of the process starting with an introduction to the problem
and ending with the final solution and conclusion. Our team found a jewellery artist who
was willing to be an active part and supporter of the project. All the statements about
the artist are real facts, provided by herself.
Responsible authors of all the sections in the report are mentioned in the footnote.
Additional graphics and images are mentioned in the footnote and added in the
Appendix.
Introduction 1
Artist’s Identity Profile
Irizan Imamova is a hand-made jewellery artist. Since 2011 she is creating her pieces of
art under her own brand "Iri Jewellery". She has an existing website functioning as a web
shop which brings her satisfactory revenue. She is operating on the Bulgarian market.
Media channels which are currently used to promote the brand are Facebook and
Instagram. As an artist she insists on high quality in production and precision in design.
Problem Area
Since returning her hobby to business Irizan has put the emphasis on sales for a long time
and hasn't paid the needed attention on her presence as an artist. Now she wants to
move to the next level aiming at brand awareness for Iri jewellery and turning the lights
1 Hristina Dimitrova
EXAM REPORT – IRI JEWELLERY 5
on herself as a recognizable valuable artist with a strong online presence. As a young
and ambitious artist her next challenge is Scandinavian market.
Problem Formulation
How the online presence of Irizan Imamova should be improved to distinguish her as a
valuable artist among competitors in Scandinavian market and in the same time to
create awareness and communicate effectively her brand Iri Jewellery.
Business Insights2
Market research
The market
Denmark has a sound basis for obtaining a share of the increasing market for creative
products and handbags, watches and jewelry.
According to the jewelry editor Charlotte Møbjerg Ansel-Henry, in the Scandinavian
market jewels play an important and independent role on the fashion scene and
Copenhagen has the role of the hub.
Sleek minimalist design is a celebrated characteristic of the Danish jewellery market and
it can be difficult for young designers to set themselves apart from the crowd. But, some
of the Danish artists strives to ensure their handmade pieces are all completely individual,
distinguishing their brands from others. They are also fairly affordable for handmade
pieces; a pair of earrings start at around 250DKK.
2 Georgeana Panturu
EXAM REPORT – IRI JEWELLERY 6
Potential competitors:
1. Danish artists
2. Danish websites
3. Known shops from Copenhagen
We have started the business plan with a deeply jewelry research about the
Scandinavian market. We have categorized the results in 3 different areas, like: Danish
artists, Danish online shops and very-known jewelry shops in Denmark. We are going to
focus on the Danish jewelry artists who are making handmade, unique jewels, as they are
our main competitors.
Business environment and external factors
There are two kinds of business environments: micro and macro. These environments’
factors are beyond the control of marketers but they still influence the decisions made
when creating a strategic marketing strategy.
Micro Environment Factors
The customers: young women between 20 and 30. Our artist’s jewellery have affordable
prices, so the target group doesn’t necessary need to have a fulltime job / high income.
The competition: Danish artists – are the main competitors on the market, as they also
design handmade jewellery with precious stones. More than this, there are several Danish
jewellery websites that don’t have a shop in the city, but they do provide quality jewels
at affordable prices. And in the end but not the last competitors are the very known
shops like Pandora and Aveny.
EXAM REPORT – IRI JEWELLERY 7
Macro Environment Factors
Demographic forces: Being a Danish artist is definitely a plus since Danish jewellery is
deeply anchored in the country’s history. More than this with both expertise and creativity,
famous Danish jewellery brands range from 110-year-old silversmith Georg Jensen or 50-
year old, family-run Ole Lynggaard, to trendy, diamond-studded Shamballa Jewels worn
by superstars around the world
Technological factors: Since Denmark doesn’t have a big home market and artists can’t
rely on finding precious stones and materials on the Danish soil (Denmark has little amber
and a few freshwater pearls), so it required them to be creative. Diversity became a
strength. Yet, the brands that truly made it internationally are those with a universal
aesthetic.
Competitor analysis
In order to have a better understanding about strengths, weaknesses, position and shares
in market, we conducted competitors’ analysis. As we have focus on Scandinavian
market, we looked for jewelry designers only in this specific area. For defining direct
competitors, we searched designers who have similar products and revenue goals. As a
result of the research, we have chosen to describe and compare three famous
Scandinavian artists: Carre Jewelry, Sif Jakobs, Maria Black Jewellery.
CARRÉ JEWELRY
Carré Jewelry celebrated its 25th anniversary this year, now with four stores in Denmark
as well as outposts in Taiwan and Japan. The colorful collection of rings, earrings, and
bracelets is heavily influenced by female personalities, from Elizabeth Taylor to Danish
author Karen Bixen.
EXAM REPORT – IRI JEWELLERY 8
SIF JAKOBS
The Iceland-born designer Sif Jakobs has been creating her namesake brand out of
Denmark's capital since 2000. Sif Jakobs Jewellery designs and produces sophisticated
jewellery of the highest standard with a modern expression. Today, the brand is known
for its unique design profile and strong DNA.
MARIA BLACK JEWELLERY
Danish-Irish designer Maria Black launched her first collection MBJ in 2010 built on
ambition and passion for precious metals with a fashion-forward approach to
conceptual jewellery design. Her desire to create was sparked from the inspiration and
beauty she found, leading her to discover and pursue her natural talent for jewellery
design.
Value
preposition
Elegant, style,
luxury, quality
Style, classical,
simplicity,
quality
Luxury, style,
quality, elegance
Urban look,
style, elegant,
classical,
simplicity
Audience Modern-urban,
graceful,
elegant
people
Elegant, smart,
creative
fashionistas
Intellectual,
successful,
graceful people
Creative,
elegant,
modern-urban
women
EXAM REPORT – IRI JEWELLERY 9
Range of
authority
Rings, earrings,
bracelets,
necklaces,
jewelry for kids
Earrings,
bracelets,
necklaces,
pendants, rings
Rings, earrings,
bracelets,
bangles,
necklaces,
cufflinks
Earrings,
bracelets,
necklaces, rings,
ear cuffs
Product
prices
Approx. 200-
500 Dkk
Approx. 400-
1200 Dkk
Approx. 1200 –
2000 Dkk
Approx. 700-
1500 Dkk
Sales
channels
Online shop Online shop,
store
Online shop, store Online shop,
store
Advertising Facebook,
Facebook,
Instagram,
Pinterest,
Newsletter
Facebook,
Pinterest,
Instagram, Twitter
Facebook,
Instagram,
Newsletter
Conclusion
According to competitor analysis, Iri jewelry fits in Scandinavian market quite well as it
has similar value preposition, range of authority, concentration to quality and
appearance as other famous this area’s artists. However, there are some disadvantages
such as lack of sales channels and advertising, on which Iri Jewelry should be working on
to increase sales and brand awareness.
EXAM REPORT – IRI JEWELLERY 10
Mission, vision and values
Mission
Iri Jewellery’s mission is to deliver handmade, high quality jewels using precious stones, to
every woman. Her goal is to make beautiful jewellery affordable for everybody, using
high quality materials and unique attractive designs.
Vision
Our artist’s vision is to expand her brand across borders and to get known for her unique
pieces of art. Her aim is to be recognizable as a valuable artist.
Values
Handmade/ unique products
Quality – precious stones (Swarovski)
Accessible- price comes straight from the artists (NO intermediary costs)
Business model canvas
The most important parts of the Business Model Canvas due to our concept are value
propositions, customer relationship, channels and customer segments.
Value proposition is directly connected with the values we have established as engines
of the website. Bringing value to the service we offer is our main goal.
Customer relationships are in the core of our concept. Creating long-term relationships
with them is a factor of success.
Channels are considered also as an important piece of the concept and essential for
realizing the idea.
Customer segments - young women between 20 and 30. Our artist’s jewellery has
affordable prices, so the target group doesn’t necessary need to have a fulltime job /
high income.
EXAM REPORT – IRI JEWELLERY 11
EXAM REPORT – IRI JEWELLERY 12
Business goals for the website and selected digital media
Our main goal is to improve the online presence of Irizan Imamova in order to distinguish
her as a valuable artist among competitors in Scandinavian market.
Our focus is to create awareness and communicate effectively her brand Iri Jewellery.
Through the selected media channels as Facebook, Instagram and Pinterest we are
planning to advertise and make her brand visible on the Scandinavian market.
We are in the process of developing an easy and friendly-user online shop in order to
deliver a nice experience and creating a long-term relationship between the artist and
the customers.
SWOT
S1: Unique handmade jewels
S2: High quality materials like precious stones
S3: Affordable prices for the Scandinavian market
W1: Weak brand presence
W2: Limited amount of products
W3: Lack of sales channels and advertising
O1: Scandinavian market is an open market who appreciate handmade
unique designs and products
O2: Artists are supported by the Danish culture
O3: Prices are a bit lower comparing with Danish artists
T1: Competitive market
T2: Competitors have an online shop or even stores in the city
EXAM REPORT – IRI JEWELLERY 13
TOWS
(S) (O) / Maxi-Maxi
Affordable prices comparing to the average price on the
Scandinavian market (S3, O3)
A great opportunity for selling handmade unique products (S1,
O2)
Scandinavian people appreciate luxury products (S2, O1)
(W) (O) / Mini-Maxi
Handmade unique products made out of precious stones at affordable price for the
Scandinavian market. Improving the online presence by advertising will create visibility and awareness.
(S) (T) / Maxi-Mini
Unique handmade jewellry market is a strong
competition, but high quality precious stones at affordable
price can be a successful business.
(W) (T)/ Mini-Mini
Focusing on promoting the brand through the social media channels.
EXAM REPORT – IRI JEWELLERY 14
Communication3
Initial user research4
Survey
Before defining user´s profile and continue with design brief we decided to create a user
survey to gather more information about the potential users, their buying behavior, their
preferences and expectations about the website. Most of the questions were with an
open answer. The aim of this was receiving information which comes direct from the user
without any influence by us. Results from this survey will play the role of a starting point
for solving the problem.
About the survey
We divided the survey in two sections. First one was about the users themselves, the
second one was about users' expectations about the website. The Survey was
conducted online and the participants were representatives of the target audience. To
receive more accurate and non-professional feedback we avoided intentionally female
students from MMD program.
Results and Conclusion
USERS|
Demographic data:
Most of the users were originally from Denmark. All of them are living, working or studying
in Copenhagen area. They work or study in various fields, but they all had something in
common - passion about style and accessories.
3 Hristina Dimitrova 4 Hristina Dimitrova, Zlatka Rizova
EXAM REPORT – IRI JEWELLERY 15
Buying behavior:
We asked our users questions like `How often do you buy jewellery ?´, ´Do you wear
handmade jewellery?´ , ´Where do you search when you want to buy new jewellery?´,
´Do you prefer online or physical shopping?´
Answer to these questions were as various as the users who participated in the tests. Main
results of this part of the survey were that users are mostly searching online when they
want to buy something new. Almost all of them have a preferable artist or brand but they
are opened to give a chance to unknown artist if the design and quality are worth it.
They are also willing to buy handmade jewellery because it's considered as trendy and
unique. Price is not an issue in that case, because most of them are willing to pay up to
1000 DKR. Users are using social media like Facebook pages, Instagram and Pinterest as
a main source of information about new modern artists and brands.
Regarding answers from this section we can conclude that the right usage of social
media could be the protagonist of communicating the artist's identity and brand. Results
also turn on the light that word of mouth marketing strategy is never old fashioned and
it could be used as a working tool. It appeared that the most important value for user
when they choose jewellery is DESIGN, that means that to promote the artist in a best
way we should choose to show in the gallery the most distinguishing items which could
present her in the best way. A way of doing this will be to show various items to users
when we conduct a focus group interview and see which products will be most popular.
WEBSITE
In this section we focused a little on UI and more on UX. We wanted to know more about
users' ideas about how the website should look like. We asked them about color, design
and style preferences to get initial idea about the UI of the website. We asked also basic
questions related to functionality of the potential site. Where do they expect to see the
navigation, the social media icons, etc.
EXAM REPORT – IRI JEWELLERY 16
Answers to these questions gave us basic but important information for the design
program. Most of the users prefer light but soft colors, contrast and minimalism in design.
Most of them expect social icons to be in the footer, but we have to mention that this is
because of common sense. Navigation all of them expect to be on the top of the page
but some of them mention they expect to be aside. Users expect to see details about
the materials from which the products are made and also if they have the option to buy
the product they would prefer to do it directly from the website and not to be referred
to an external page.
User tests
Design User Tests
To make a visual testing on the design we conducted BERT and 5 second tests on the two
mock ups
First we showed to the users 5 second test and after BERT. The reason for this order is that if
users make first BERT they already would be prepared for the 5 second test.
Note:
5 second test was conducted on 2 mockups created based on initial survey about
handmade jewellery website. Tested users were part of the target group (young women
between 20/30 years old, living, working or studying in Denmark). Results are summarized
from the two mockups tests, because answers to both of them were very similar.
EXAM REPORT – IRI JEWELLERY 17
5 second test result and conclusion
1. What do you think this page was about?
On these questions most of the users answered "jewellery", but some of them were
confused from the images of the bride that the page is about wedding jewellery or
jewellery for special occasions. Regarding this results image will be changed with a not
confusing one.
From answers to this question we also understand that it is not clear to users that jewellery
is handmade which is one of the core values for the brand and the artist. That’s why
emphasizing this information should be considered for the final mock up.
2. Rate the quality of this page between 1 and 5
Results on this question are satisfying but not good enough as we want them to be. Users
rated the page between 3 and 4. This should be a red light for us to improve the whole
appearance of the page, which is very important for creating brand awareness
3. Did the brand appear trustworthy?
Answers to this question were various. The basic and most important conclusion from them
is that if more information about the brand itself is put on the home page it will make the
brand appearance more trustworthy and strong. Other recommendation from users is
that by using more simple design for the webpage brand also will appear more
trustworthy and will not look "cheap"
4. Which element on the page did you focus on most?
Almost all the answers are saying "the bride". That confirms the conclusion made from the
answers to the first question that we are sending a wrong message to the users using that
image and we have to change it with something simple which sends the right message.
EXAM REPORT – IRI JEWELLERY 18
Design
Minimal
Clear
Professional
Friendly
Interesting
Modern
5. What was the brand name?
Most of the users don’t remember the name of the brand, because of too much noise on
the page. This shows again that if we simplify the design and make it more clear, the
brand will be noticed easier and become memorable.
BERT5
GOAL:
The aim of our mock ups was to reach results closer to 1 point (left side answers). Conclusion
is made as a summary of the two BERT results, because the answers are almost the same
to both of them. This test appeared to be very significant and important for design process,
because we could extract the minuses of the design and improve them in the final mock
up, which will be later tested again. For this test we focused mainly on users who are part
of KEA digital, because we wanted to receive more professional feedback regarding the
design.
5 Results graphics, screenshots plus mockups in the Appendix
EXAM REPORT – IRI JEWELLERY 19
Mainly results are showing that the design is pretty clear, but there is what to be improved.
It's absolutely friendlier than impersonal, and at that point the goal is reached. It's also
perceived as minimal and not complicated, which is also a good start for it.
Conclusion
Main concerns are related to professional appearance of the website, how interesting it
is and if it's modern enough. What we must improve is to make design look more
professional which directly make it more trustworthy. We must think what to do to make it
more interesting and not boring to the users, because this will make them stay longer on
the page. Last but not least we must bet on the modern look. Regarding the fact that
there are many artists with very interesting and modern website proposals we have a
strong competition which shouldn't be underestimated and to try to be one step before
them. This will help to attract more users and communicate the brand effectively.
Users define the design as more casual than formal. And here appears the question should
we keep the formal design goal or change it to casual. We will reconsider this goal and
ask the users again about their preference.
EXAM REPORT – IRI JEWELLERY 20
FINAL BERT6
Final BERT was conducted on a new created mockup which is a result of the conclusion
made on the previous two BERTs on the initial mockups. The aim of the final mockup was
to improve all lacks of the design and to cover as much as possible the design goals we
set in the beginning.
Results and conclusion
Results from BERT on this mockup showed that we reached the goal and we could use it
as a base for developing the website.
Communication plan7
Purpose, objective goal
The objective goal of the website is to improve the online presence of Irizan Imamova
(Iri ) and her brand Iri Jewellery. In the digital world we live our artist and her own brand
could not survive, be competitive, recognizable and popular without a strong online
presence. Using the power of social media as a bridge between the artist and her target
audience could make stronger her online presence. Also showing to the users who the
artists is and what is the story behind her art would deliver the message Irizan Imamova
wants to send via her art.
6 Graphic in the appendix 7 Hristina Dimitrova
EXAM REPORT – IRI JEWELLERY 21
Effect
Effect of the website will be to popularize Irizan Imamova as an artist and her brand Iri
jewelery among Scandinavian users
Message
Hand made with love
Sender
Irizan Imamova - handmade jewellery artist from Bulgaria.
Note: see artist’s identity profile
Target audience
Location: Denmark
Age: 20/30
Gender: Female
Occupation: students/ young professionals with a personal style
EXAM REPORT – IRI JEWELLERY 22
User profile
Gender: female
Country: Denmark
Hometown: Ebeltoft
Current address: Valby, Copenhagen
Name: Ida Jørgensen
Age: 26
Occupation: Marketing Intern at Think PR, Copenhagen
Education: Brand Management at University of Copenhagen
Interests: Organization and participation in marketing campaigns and social events
EXAM REPORT – IRI JEWELLERY 23
Customer Journey
Pre – Service Period
EXAM REPORT – IRI JEWELLERY 24
Service Period
EXAM REPORT – IRI JEWELLERY 25
Post – Service Period
EXAM REPORT – IRI JEWELLERY 26
Digital media
As it’s mentioned before in the digital world we live digital media is one of the most
efficient weapons of any artists or business to have a strong and persuasive online
presence. Developing a portfolio website which represents the artist’s work and herself
is the basic step and foundation. But the real deal is not only to be online but to be
actively online, up to date and follow up your target audience. Facebook and Instagram
are proved to be the social media channels which are more than successful and working
tool for being popular. As much active the artist is by using these tools as better will be for
her brand, for her popularity as an artist and her image among the users. A trustworthy
image is the key for strong customer relationship and social media is very important for
building it. Having a Facebook page, an Instagram profile were the first steps the artist
made for her online presence, but they were representing only her art and not herself.
Now with developing a portfolio website we give the users a chance for a deeper look
inside what and who is behind this art. Being consistent we put an emphasis on social
media in the new build website and giving also an opportunity to users to contact directly
the artist on the contact page. Sharing images of art users like in Instagram and
Facebook, saving them on Pinterest and also sharing will gain popularity to Irizan
Imamova. Once users start sharing they start networking and word of mouth marketing
will be brought to the next level.
SEO
SEO is essential for successful online presence. The reason for that is pretty simple. An artist
could have a fabulous website, but when nobody visits it all of the hard work and effort
become nonsense and a lost cause. There are many ways to search engines to be
pinged, but in our particular case we needed something which will work for the artist.
Regarding the fact the we used WordPress as a CMS we found two solutions. First of them
is to use Yoast SEO plugin for WordPress and the other one is to activate the XML sitemap
EXAM REPORT – IRI JEWELLERY 27
functionality, which will automatically ping Google and the other search engines
wherever the artist post something new.8
USP & ESP
USP
Unique selling proposition is an essential part of the communication between the Artist
and her target audience. What makes Iri and her jewellery unique and distinguishing is
something that local Scandinavian artists don’t have for a simple geographical reason.
This simple unique feature is the Southern accents of the design which make her art
recognizable and different from what is offered in the market. This couldn’t be
considered as a disadvantage but as a main advantage because Scandinavian women
tend to be trendy and open minded for something new which will make them shine.
USP of Iri’s art is also related with her main values – high quality and original unrepeated
design. Materials she uses are Swarovski crystals which are very popular among young
women and silver which is the preferable metal in Scandinavia.
ESP
If USP is essential for Iri’s brand and sales, then ESP is twice more important for herself as
an artist and the message she wants to send to her customers. Establishing strong
customer relationship is the key for a long lasting and loyal engagement. As an unknown
artist to Scandinavian market Iri is facing a challenge not only to be noticed, but to build
a bridge between her and the new customers. The question is how to build that bridge
and achieve the goal. During the survey we made we asked potential users if they would
like to know more about the artist. The results show that the majority of them are interested
in the artist herself and knowing more about who is standing behind the product is very
important for building trust. The challenge here was to find the best way of presenting Iri
8 http://rightbrainrockstar.com/general-advice/16-things-you-can-do-today-to-get-your-artwork-noticed/
EXAM REPORT – IRI JEWELLERY 28
in a light which is distinguishing, friendly and in the same time trustworthy. We were
inspired by VOGUE’s videos about famous people and artists where they are being
interviewed in their homes in the most natural way while they are doing random daily
tasks. These videos are very popular among young women and they have a lot of
followers. This approach of presenting an artist in a natural light is considered to be
successful for building a trust and closer relationship with the customers. We decided to
go even further than VOGUE where the filming is somehow directed and we asked Irizan
to make herself a homemade video in which she is making a small talk about the story
behind her art, how she started, what inspires her and why her art is important and special.
Visualization9
Design brief
Artist profile
Irizan Imamova is a handmade jewelry artist. She needs a responsive website with
modern design. The website should be professional, clear and minimalistic with the main
purpose to present her products in the Scandinavian market. Based on her first website
and her own design she prefers to her new website three colors: grey, pink and white.
Design objectives
- Responsive website and mobile friendly;
- Contemporary design and modern UI;
- Appropriate colors for the target group;
9 Zlatka Rizova
EXAM REPORT – IRI JEWELLERY 29
- Transform Hicks law to Fits law;
- Simple navigation bar with three main sections: "Home"; "Gallery" and "About the
artist";
- Option for purchase but the emphasis is on the gallery;
- Clear social media menu for the users;
- Video related to the artist and her work
Issues
Internal approval process
One of the main issues we can have is the time spent on the internal approval process.
In order to speed up the flow of a document, we need to have a well-thought-out
workflow. It will streamline the time it takes to coordinate the approval process by
managing and tracking the different stages of the process. It will also streamline the cost,
minimize any risk and make for a more efficient work process.
Technical Constraints
We can refer to different platforms used by users, Android/ iPhone(ios), PC/Mac in which
case we have to make sure that the website offers the same experience in every use
scenario. We need to make sure that the website is delivering the same quality of service,
no matter how new/updated the platform used by the user is.
Additionally, we have to make sure that the website is updated to make sure it works as
intended on new updated platforms, or in other words: maintenance.
EXAM REPORT – IRI JEWELLERY 30
Design examples10
We observed the competitors of Iri Jewellery in details on the Scandinavian market
because we wanted to build an equivalent website to those of the direct competitors
such as Carre jewelry, Sif Jakobs jewelry, and Maria Black.
We made a research analysis of the most modern websites of 2017 because our aim is to
create a responsive, clear and minimalistic website with contemporary style. The
examples of some of the most modern websites of 2017 can be seen in the Appendix.
Design Process
Sketches11
We created sketches based on the information from the artist and her current website
and identity. In the beginning of her work, she made budget jewelry but over the years
her business has developed and she started to work with Swarovski and producing more
luxurious options.
In her current website, we found jewelry for women, men, and kids. That's why the
sketches include a navigation bar with four main sections - "Home", "Casual", "Deluxe"
and "About". The sections "Casual" and "Deluxe" have categories: "Women", "Men", and
"Kids". By "Casual" we mean her budget jewelry and by "Deluxe" - her luxurious jewelry.
When the user clicks on a product a new page opens with detailed information about
the product, product's name and a button "Buy now".
In the "About" page the user can find the artist's story, her contact information, and video
for her product - hand-made jewelry.
10 Design examples could be seen in the Appendix 11 Sketches could be seen in the Appendix
EXAM REPORT – IRI JEWELLERY 31
We mentioned in the sketches the media channels which the artist uses - Facebook and
Instagram.
We use the sketches to visualize our early understanding of the client, her work, and her
customer base. Additionally, the sketches would serve us as guides for the page content.
Mood Board12
After the survey, we made a mood board which illustrated our target group - women,
the product - jewelry and the colors which were chosen from the users - soft, light and
feminine colors.
We used the mood board as an inspiration for the first mock-up.
12 Bigger size of the mood board could be seen in the Appendix
EXAM REPORT – IRI JEWELLERY 32
Wireframes13
We created the wireframes based on the survey and card sorting test. We focus on the
Scandinavian market and more precisely, females living in Denmark because they show
interest in jewelry, unlike men and children.
After the results of the survey and card sorting test, we adjusted the main sections a little.
Instead of "Casual" and "Deluxe" from the sketches, we put a "Gallery" section with
categories: "Rings", "Bracelets", "Necklaces", "Earrings" and "Kits", because our target
group is women which are ready to spend more than one thousand krona on jewelry
and the price is not an issue in this case. Also, we added a Social media" section to the
navigation bar ", because it is important for the users. And the last main change we made
was on the "Product" page where the users can now see the price of the product
because it is important for the users to see the price before they click on the button "Buy".
The wireframes were helpful to give us a clearer picture of how the new website of our
client will look on a mock-up.
Mock-ups
For the Five-second test and BERT test, we prepared two kinds of mock-ups based on a
survey, card sorting test, mood board, and wireframes. Both of them have a mobile
version and desktop version because our aim as multimedia designers is to create a
responsive website for our client which should be modern, minimalistic and professional.
We chose a different design for the mock-ups because we wanted to give the users more
options and they could select the best ones and help us to improve the user interface
and the user experience.
For the mobile versions of both of them, we used similar colors, fonts and burger menu
but the difference is in the footer where one has a fixed footer with social media. Also,
13 Wireframes could be seen in the appendix
EXAM REPORT – IRI JEWELLERY 33
one of the mock-ups has a slideshow on the homepage as opposed to the other which
has a main image.
For the desktop version we used different navigation bars - aside and a horizontal
navigation bar in the header, but in the two mock-ups, the user can find the social media
in the header.
After the results of the Five-second test and BERT test, we created a third kind of mock-
up which was improved based on the user's answers. Thanks to the tests we managed to
reach our aim and make a clear, professional and minimalistic design for the website. It
is confirmed by the user's answers to the last BERT test of the third mock-up.
EXAM REPORT – IRI JEWELLERY 34
StyleTile
Design
For our website, we chose a contemporary design. The contemporary design is modern,
clear, simple and fit for different devices. That's why we used a large responsive image
on the home page, which can be seen in the most modern websites nowadays. The
large responsive image can be visible on different devices - computer, tablet, mobile
and accurately describe what the website is. For the mobile version, we removed the
busy navigation bar and changed it with a modern burger menu to make the user
experience clearer without distractions.
Color palette
Our persona prefers light, soft, feminine colors and contrasting darker colors.
That’s why we use white color for the website with shades of pink, gray and black colors
for contrast.
EXAM REPORT – IRI JEWELLERY 35
Logotype
We redesigned the artist's original logo. We used Vivaldi Italic font because it is a
handwritten font which looks elegant and feminine and gives a feeling for something
which is handmade. The diamond element emphasizes to the user the product which is
jewelry. The soft pink color of the logo hints that it is handmade jewelry for females.
Typography
We chose to work with Roboto Light font from the Roboto family for the website because
it is a web safe and sans-serif and also it is appropriate for responsive websites. Roboto is
a font developed by Google and is used as the default font for their mobile operating
system – Android. This gives the advantage of providing the user with a more seamless
and consistent user experience on their mobile device. Google themselves describe the
font as being “modern, yet approachable” and “emotional”.
Also, we use Freestyle Script font for an accent when we want to emphasize title or quote.
Composition
For the navigation bar on the desktop version, we use symmetrical composition. The logo
is in the center and on the left side of the logo is the menu with main sections on the right
side of the logo is the social media menu.
On the mobile version, the users can see symmetrical composition as well. On the left side
is the logo and on the right - burger menu.
EXAM REPORT – IRI JEWELLERY 36
We used hicks law for a "Gallery" section but for “Home”, “About Iri” and “Contact”
pages we used fits law.
Gestalt laws
PROXIMITY - Elements which are close to one another are part of one group and is clear
that they are all part of one item. It can be seen in the individual posts on the website.
SIMILARITY - The individual posts are similar to one another conveying the sense that
although they are different items they are all product items.
Design program
LOGO
History of the logo
Our client’s logo includes her name and her product. She has some variations from the
beginning of her idea until now.
This is the first one for her first website.
She has another one which she uses on Instagram and Facebook.
EXAM REPORT – IRI JEWELLERY 37
We redesigned her second logo according to the survey for the website UI and UX
because the users prefer light and soft colors. That’s why we changed the logo color with
softer pink. Also, the users would like to see more contrast and this is the reason the
diamond element in the logo is darker.
Colors
The colors are an important part of the artist's visual identity. The black and white colors
are classical and give the sense of professionalism. The soft pink color is a gentle and
feminine and also it is appropriate for our target group - young women of Scandinavia.
The grey color is for contrast and at the same time, it combines well with the pink color.
Typography
The Roboto Light font was chosen because it is a safe web, suitable for different devices
and readable by the users.
Freestyle Script font was chosen because it collaborates well with the style of the artist
and gives a feeling for something which is handmade because the Freestyle Script font
is in the group of handwritten fonts.
Vivaldi Italic is handwritten font either. It looks beautiful and emphasizes the elegance of
the artist and her unrepeated work.
EXAM REPORT – IRI JEWELLERY 38
Video
To build good ESP for the Iri Jewellery website we implemented a video related to the
artist and her work because this is what the survey results show. The users are interested
in seeing and receiving more information about the story behind the artist's art.
Unfortunately, the video quality is low because we had no chance to meet Irizan
Imamova in person and to make an interview with her with a professional camera
because she lives in Bulgaria and we are situated in Denmark but we are satisfied from
the result of the video as we show what the users want to see and hear. On the video, Iri
is shown in the most natural way in her daily routine and the users can hear Iri's story from
her own perspective. In this way, we established a strong and loyal relationship between
Iri and her customers.
Interaction14
After creating design brief based on different analysis and user tests, we started
developing a website, which would fulfill both artists and customers’ needs and desires.
The process
Starting from scratch
Before beginning to develop a website, we have created a new GitHub repository, so
that all group members would be able to access the code and work on it at the same
time. After this, we have started creating a simple structure of the site in brackets. First
we made it for the mobile version, later – created it more responsive, so that it would fit
for all digital devices. For this, we have been using media queries.
14 Gintarė Jankūnaitė
EXAM REPORT – IRI JEWELLERY 39
Creating Database
For database we have chosen to use WordPress, as it is easy to take information from
and simple for the artist to update new content. To extend functionality and add new
features to WordPress, we have installed few plugins. One of them is - Advanced Custom
Fields, which allows us to add extra information field to post. In our case, we used it to put
price and material fields that are required, so that the artist would never forget to write
in it. Another plugin is ACF to REST API, that sends custom fields to API, and we can use
them for our website.
Each post we divided in different categories (rings, earrings, bracelets and necklaces)
and added tags, which are unique for every product. Due to this, the customer would
be able to find the specific item very easily, as it has few searching options.
Fetching data
To fetch data from WordPress and use it on our website, we have been using JSON.
We have created a template, where we added all information about item, such as: title,
image, description, price, materials and “Buy” or “Details” button (depends of the page)
and cloned it multiply times, to show all items, that we had on WordPress.
EXAM REPORT – IRI JEWELLERY 40
Moreover, we called few more functions: one of them shows single post on the page
(we used it for giving more details about product):
And function that shows posts divided by categories:
EXAM REPORT – IRI JEWELLERY 41
For having categories listed in menu, we created one more template, which allows
putting all categories from WordPress, without writing them manually:
After that we called function, which fetches categories and ads to the menu:
EXAM REPORT – IRI JEWELLERY 42
Styling
For styling the website, we used both external (which has been used the most) and
internal (only for specific items) stylesheets. As the mockups that we have been testing
have a very simple style, we tried to keep it the same way in styling website too. However,
we still had some issues with creating navigation, as on mobile and bigger screen
devices, we needed different kind of dropdowns. Due to this, we used some examples
from w3schools.comi
For contact page, we have chosen to use contact form, where user can fill in his
information and sent directly to the artist. To do so, we took an example from
w3school.com again.
EXAM REPORT – IRI JEWELLERY 43
Tests on developed prototype15
After developing the website’s prototype we needed to check its functionality. That’s
why we conducted Krug’s Trunk test, Expert test and Think aloud test.
First test we conducted was checking Krug’s Heuristics. Participants in this test were KEA
students but outside MMD program. The aim of this choice was that we needed to see
how any potential user would navigate and explore the website and we didn’t need to
focus on the specific target group to get a feedback. We avoided MMD students for the
reason that they could orientate easier observing the page.
Krug’s Trunk Test
At any page point out as fast as possible we asked to testers the following questions:
1. What is this? (Site ID)
2. What page am I on? (Page name)
3. What are the major sections of this site?
4. What are my options at this level? – (local navigation)
5. Where am I in the scheme of things? – (indicators, e.g. “crumbs path”)
Results and conclusion
All the 5 participants in the test managed to identify the site ID, to define on which page
they are (we showed different pages to each participant) and they could define their
options according to navigation. Some of them were not sure how to answer to the last
15 Hristina Dimitrova
EXAM REPORT – IRI JEWELLERY 44
question regarding indicators and crumbs path. Here we found one issue in our prototype
– there was not an indicator which was showing on which page was the user. All of them
managed to understand this regarding the information on the page. This fact showed us
that we need to improve UX at that point. Possible solution to this problem was to change
the color of visited page which would indicate it.
Heuristics inspection
Heuristics inspection was conducted because we needed to receive feedback not only
from potential users but also from experts. The role of experts played MMD students, who
have already done this kind of expert review and are familiar to heuristics. Conducting
heuristics inspection we tested website prototype’s navigation, efficiency and
functionality.
Navigation – Makes getting around the site easy and takes out the guess work of a
user’s visit.
Heuristic Rating 1-5
Efficiency/Functionality – Following basic rules will keep user frustration to a minimum.
Website loads quickly 4
Proper etiquette for links off site 5
Contact information is easy to find 5
Results from this Heuristic Inspection are more than enough to conclude that our website
is easy to navigate and efficiency and functionality levels are satisfying.
Note: Results ratings are summarized.
Consistent Navigation 5
Easy to identify your location on the site
(breadcrumbs, headers, colors)
4
Consistent way to return Home 5
Limited number of buttons & links 5
Organization of information makes sense 5
EXAM REPORT – IRI JEWELLERY 45
Conclusion
From ideation through deep research, surveys, user tests, creation and development our
team went through the whole process of solving the case assignment aiming to reach its
goal and to find the best solution for the formulated problem. Reaching the ending point
we found out that the prototype we built is a permanent solution for developing our
artist’s online presence because digital world and media is rapidly changing and what is
a good working tool today maybe will be outdated and not enough tomorrow. As
multimedia designers we used different tools and approaches we have learnt our first
year at KEA to develop the presented prototype as a competitive and useful platform
for the artist. Covering the four core areas important for multimedia design, we were led
by user centered design, cause no matter how good the artist, her work or her website
is, when user is taken for granted.
EXAM REPORT – IRI JEWELLERY 46
Reference
1. https://www.agora-gallery.com/advice/blog/2016/08/25/promote-your-art/
2. http://rightbrainrockstar.com/general-advice/16-things-you-can-do-today-to-
get-your-artwork-noticed/
3. https://www.w3schools.com/howto/howto_css_dropdown.asp
4. https://www.w3schools.com/howto/howto_js_accordion.asp
Design inspiration
5. https://www.maria-black.com/en/eu/
6. https://www.sifjakobs.com/
7. https://www.carrejewellery.com/
8. https://www.applify.co/
9. http://bodytoburn.com.au/
Potential competitors:
Danish artists
10. https://www.olelynggaard.com/en/collections-dashboard/
11. http://www.shamballajewels.com/
12. http://www.hartmanns.com/
13. https://annilu.dk/collections/all
14. https://www.maria-black.com/en/eu/bracelets
15. http://sophiebillebrahe.com/boutique
Danish websites
16. https://koloursjewelry.com/about/
17. https://www.chanti.dk/m-krystal
18. https://www.glamira.dk/swarovski-krystal/
19. https://www.voselle.dk/ovrige/krystalsmykker
20. http://phertz.dk/smykker/
21. https://www.carre.dk/
Known shops from Copenhagen
22. https://aveny.dk/home.php
23. http://www.pandora.net/da-dk
EXAM REPORT – IRI JEWELLERY 47
Appendix
Sketches
EXAM REPORT – IRI JEWELLERY 48
EXAM REPORT – IRI JEWELLERY 49
Mood board
EXAM REPORT – IRI JEWELLERY 50
Wireframes
Wireframes for mobile version:
EXAM REPORT – IRI JEWELLERY 51
Wireframe for the desktop version:
EXAM REPORT – IRI JEWELLERY 52
Mock ups
EXAM REPORT – IRI JEWELLERY 53
Design examples
Carre jewelry
EXAM REPORT – IRI JEWELLERY 54
Sif Jakobs jewelry
Maria Black
EXAM REPORT – IRI JEWELLERY 55
EXAM REPORT – IRI JEWELLERY 56
Design manual
Logo
Our client’s logo is a very important element of her visual identity. When used correctly,
it will make her brand stronger and more identifiable by her clients.
[A]
[B]
[C]
EXAM REPORT – IRI JEWELLERY 57
Logo [A] is the preferred and primary logo. It must be used whenever possible.
When the logo color is reversed [B], it can be used on same colored backgrounds as
logo [A].
A monotone black and white logo [C] is available for use when a second ink color is
not available.
Incorrect use of logo
To maintain IriJewellery’s brand unique in the customer’s mind, it is important that the
logo be used correctly and consistently. Its integrity must never be compromised.
The following examples show how not to use the logo:
Do not change the font of the logo.
Do not place the logo on top of a noisy or multicolored back-
EXAM REPORT – IRI JEWELLERY 58
ground. The logo should always appear as clear as possible.
Do not change the color of the logo.
Do not use the logo without its Diamant element.
Colors
The essential of a building of strong and unique visual identity are the colors and their
consistent use.
HEX and RGB:
Used for digital applications
CMYK:
Used for printing and digital printing
EXAM REPORT – IRI JEWELLERY 59
Typography
Iri Jewellery website has three main fonts:
Vivaldi Italic for the logo:
Roboto Light for the text of the website:
Freestyle Script font is used the accent for a title of the products or quote
EXAM REPORT – IRI JEWELLERY 60
Test results
Survey
EXAM REPORT – IRI JEWELLERY 61
EXAM REPORT – IRI JEWELLERY 62
EXAM REPORT – IRI JEWELLERY 63
EXAM REPORT – IRI JEWELLERY 64
EXAM REPORT – IRI JEWELLERY 65
EXAM REPORT – IRI JEWELLERY 66
BERT
BERT Goal
BERT 1 Mock Up
EXAM REPORT – IRI JEWELLERY 67
BERT 2 Mock up
Final BERT
EXAM REPORT – IRI JEWELLERY 68
WordPress guide
1) Login to WordPress
2) Press on the “Posts” icon
EXAM REPORT – IRI JEWELLERY 69
3) Create a new post
4) Put the content in the text field
EXAM REPORT – IRI JEWELLERY 70
5) Put an image in featured field
6) Fill in custom fields
EXAM REPORT – IRI JEWELLERY 71
7) Add category and tags
8) Publish it
Done!
EXAM REPORT – IRI JEWELLERY 72