Interactive Design / Bachelors of Design (Honors) in Creative Media / Taylor's
University
Website #1 - https://www.goldenchild.media/
Golden Child
Purpose and Goals
This website is created by a multidisciplinary creative studio that thrives
at the intersection of art, entertainment and culture. The purpose of the
website is to advertise their expertise in directing and film-making by
showcasing their works. The banner of the website shows multiple of their
works playing in the background, which easily explains what their brand is
about. Their goal of the website is to raise brand awareness and attract
more potential clients into working with their studio.
|
|
Figure 1.1 Golden Child banner
|
Visual Design & Layout
The color tone for the website complements the name of the studio, only
using three main colors which are gold and white for texts and black as
the background. The simple color palette ensures that the website design
does not outshine their content, so that users are able to focus more on
their displayed artworks. The typography is clean and comfortable to read,
the placement and choice of font is great as well, it matches the overall
theme. The layout for the website is structured, neat and not cluttered,
there is a good balance between the contents and white space. The
imageries are all carefully-selected thumbnails of their artwork or
preview videos. Some of the imageries only show up when the cursor is moved towards the
button, which helps maintain the cleanliness of the layout, but still
makes sure that users are able to see the intended imageries. There is
animations applied to all of the buttons. Overall, the design is
aesthetically pleasing.
|
|
Figure 1.2 Golden Child selected works layout
|
|
|
Figure 1.3 Golden Child works layout
|
Functionality & Usability
The functionality of the website is good, it is easy to navigate the
website. The main index page shows the banner, the selected artworks, the
list of directors and a brief introduction to their studio. The menu
buttons leads to the individual pages for each of the categories. When u
point at the any buttons there is always animation, which gives feedback
to user. The call to action button appears when you scroll downwards and
point your cursor to the thumbnail of their artworks. When the cursor is
on the thumbnail, the thumbnail changes into the preview video. The same
feature applies to their directors list, where two small boxes of preview
videos appear at the side or at the background. It is a very interactive
and engaging website. The elements are consistent, where the contents are
mainly in rectangle shapes and the buttons are all in circle shape. The
website is fun and easy to maneuver, which ensures that users do not feel
like exiting the website easily.
|
|
Figure 1.4 Golden Child button feedback
|
|
|
Figure 1.5 Golden Child button feedback
|
|
|
Figure 1.6 Golden Child button feedback
|
Quality & Relevance
The quality of the website is great. All the elements and sections are well
organized and there are no errors detected. The video words all plays well.
The details are great and it feels like a lot of work was put into creating
this website. The relevance of the the content are good as well, it is
straightforward as they mainly want to showcase their artworks. However, the
clarity could be improved as they never stated clearly about what their
studio mainly does, the text they use are very minimal, users have to figure
it out by going through the website and viewing their works.
|
|
Figure 1.7 Golden Child clarity
|
|
|
Figure 1.8 Golden Child quality
|
Performance
The performance of the website is great. The load time is around 1-2 seconds
which is quite fast, while loading the screen shows the brand name and 2
elements at the side. There is no lag in any of the animations so
responsiveness is good as well. When using different browsers (such as
Microsoft Bing) the performance is maintained and there are no differences
as when using Google. While using a different device (mobile phone), the
animations of the buttons were reduced due to not having a cursor function
on phones, but otherwise it is still as engaging and interactive.
|
|
Figure 1.9 Golden Child loading page
|
|
|
Figure 1.10 Golden Child on phone
|
Recommendation
-
Need to improve the content clarity. The amount of texts and
introductions are too minimal, may cause some clients to be confused or
not have enough information.
-
The layout should be more interesting. The sections with a lot of white
space should add more elements, it looks a bit bland, may look boring
after awhile.
Website #2 - https://www.yulia.world/
YULIA
Purpose and Goals
This is the official website for the fashion brand YULIA atelier, which
creates made-to-order pieces of fashion art by the designer Yulia
Voytenko. The main purpose of the website is to advertise their fashion
pieces, the 'If I Were a Flower' collection. The purpose of the website is
easily communicate when opening the home page. The goal is to promote
their brand as well as attract clients into pre-ordering and purchasing
their designs.
|
|
Figure 1.11 YULIA banner
|
Visual Design & Layout
The color tone mainly consists of off white as the base color and pastel
pink for the texts. The color palette also includes vibrant colors from
their fashion collections, which are white, pink, yellow, green and blue.
The off white ensures that it doesn't cause a strain to user's eyes and
doesn't take attention away from the content, and the pastel pink
complements the fashion collection well. The layout of the website is less
structured and more collage feel, but does not look messy, it looks more
interesting this way and does not get boring easily. The typography
arrangement of the website could be improved for some parts as it is a
little hard to read. However, the choice of font is great as it matches
the aesthetics of their floral and ethereal fashion collection. The
imageries are all pictures of their fashion collection, and there are
minor animations (it zooms and rotates slightly) when you scroll through
the website. The balance between the white space and content is quite
balanced as well. When the page is loading, flower elements shows up which is very
cute. Overall, it is an appealing design.
|
|
Figure 2.12 YULIA layout
|
|
|
Figure 1.13 YULIA layout
|
|
|
Figure 1.14 YULIA typography
|
Functionality & Usability
The functionality of the website is great, it is easy to maneuver the
website. The main page shows the brand banner, the introduction to the
collections, the pieces in the collections, the background of the
brand. The menu buttons leads to the individual pages for each of the
categories. When the cursor pans across each letters in the brand name, an
imagery for the pieces in the collection appears in the background, which
clearly explains the purpose of the website. When u point at the any buttons
there is always animation, which gives feedback to user. Some of the
imageries in the website also moves along when scrolling. However, the
imageries only move a little with each scroll, which may give the false
impression that it is lagging. The call to action button is the preorder
button beneath each pieces of their collection, which brings them to the
details of the specific fashion piece, and a section to submit personal
details. The menu bar consists of home, about, collection and preorder, as
well as their Instagram page and contacts, so it is not hard for clients to
achieve their objective. The collection and preorder page is also
straightforward and provides enough imageries to ease client's navigation.
Overall, it is very user-friendly.
|
|
Figure 1.15 YULIA collection page
|
|
|
Figure 1.16 YULIA preorder
|
Quality & Relevance
The quality of the website is good. All the elements and sections are well
organized and there are no errors detected. There is also calming background
music when browsing the page. The relevance of the the content are good as
well, it is straightforward as they mainly want to showcase the fashion
pieces in their collection. The clarity is also great, the website clearly
introduces their brand as well as provides enough details for their fashion
pieces.
|
|
Figure 1.17 YULIA preorder page
|
Performance
The performance of the website is above average. However, the load time is a
little slow, which takes around 5 seconds. There responsiveness is good as
well. When using different browsers (such as Microsoft Bing) the performance
is maintained and there are no differences as when using Google. While using
a different device (mobile phone), the animations of the buttons were
reduced due to not having a cursor function on phones, but otherwise it is
still as engaging and interactive. On mobile phones, the typography are all
left aligned, which is more readable.
|
|
Figure 1.18 YULIA on phone
|
Recommendation
-
Simplicity needs to be improved, it takes awhile to scroll and get to the
call to action button.
- Loading time is a little slow.
-
The animation moves a little with each scroll, which gives the false
impression that it's lagging.
-
Typography could be improved, readability isn't optimum as the alignment
is messy.
.jpeg)
.jpeg)
Comments
Post a Comment