Question 1 - Website Design Evaluation (Aura Kingdom)

Aura Kingdom 

Website Address: aurakingdom.aeriagames.com

       Aura Kingdom is one of the Massively Multiplayer Online Role Playing Game (MMORPG) that provide a service to their customer by providing a server so that the customer can enter the server as player and can purchase in-game item. The website is sponsored and published by Aeria Games company. When the player enter the website, player must be registered before downloading the Aura Kingdom client. The website also provide news to the player regarding game content such as event, maintenance time and update content.

Website Interface :

I) Balance

         Balance in website design mean that distribution of element such as image, color and text across the design field. Balance also can be defined in term of gravity which explain the graphical interface which show the large element appear to be heavier while smaller element appear to be lighter. In the Aura Kingdom webpage, 2 type of balance is used in term of website design such as symmetrical balance and asymmetrical balance. Symmetrical balance is the balance that are used in design to place the same type of element that matching each other in design. Centering the element also can be used to get symmetrical balance image. Asymmetrical balance is the balance that that complete opposite to the symmetrical balance as they do not matched the element. 

         For example, in the aura kingdom website as shown in image 1, symmetrical balance are used to placed both of the character on the right and left of the webpage. The logo 'aura kingdom' as shown in image 1 is also centered to  show that the design also used centering to symmetric the logo. The space between text also is symmetrical to each other text. 

Image 1

         In the image 2, the asymmetrical element that are used is the sidebar and video. the sidebar appear as long rectangle and is placed as vertical while the video is also rectangle but is placed as horizontal. The color in the sidebar is set darker opposite to the video rectangle color which is white. This to ensure that the sidebar will get notified by the user.

Image 2

II) Proximity

       The principle of proximity in the web design is defined as the moved closer and grouping the related item or separate the unrelated item in order to achieve more organized look. the principle of proximity in web design is usually is used to organize the menu bar. 

       For example, in the Aura Kingdom website as shown in Image 3, The game menu bar will separate the type of platform for every kind of game such as PC Games, Browser Games, Mobile Games and Mini Games. This ensure the user to differentiate the different platform for every kind of game which prevent them from downloading wrong stuff which eventually will make them upset. 

 Image 3

       In the Image 4, the website organize all the windows platform games such as Dragomon Hunter, Aura Kingdom, Digimon Master and Elsword into category known as PC games. All this game also is put into the same category which is Anime MMORPG which is because of the design of character is same as japanese cartoon. 

Image 4

III) Alignment

      The principle of alignment in the website design is defined as the how element are properly placed and organized and the website design should not look as if it were placed randomly. The alignment is divided by two types which is edge alignment and center alignment. The edge alignment usually are used for object with flat edge such as rectangle that contain four flat edge. the proper alignment will make website look organized. The center alignment can be used for any kind of shaped object since the center alignment focused on the horizontal axis that run on the center of the object.

       For example, in the Aura Kingdom website, all the rectangle that represent information use proper alignment to make sure that all the information and graphical art are properly organized as shown in the image 5. The red line show the alignment line. It ensure that information are properly organize which enable the user to obtain proper information without being misunderstood or overlooked the information due to the poor alignment. It also user friendly since it organized the box in the proper place. 

Image 5

       The center alignment is also used in the Aura Kingdom website as shown as the image 6 where both of the character and Aura Kingdom's logo are align on the center using the horizontal alignment line. The shape of the character and logo consist of multiple basic shape which are not suitable for the edge alignment which depend of the angle and flat edge. It also ensure that the image are not scattered around which will eventually lead to the confusion of the user during browsing the website. 

Image 6

IV) Repetition

       The principle of repetition in the website design is defined by reusing the similar element throughout the website which united the different to together. Repetition will bring consistency and cohesiveness through the design. Repetition can occur on many things such as font, color and background picture of the website of different pages. 

       For example, in the Aura Kingdom website as shown in image 7a and 7b, repetition of the background picture are used to bring consistency to the website and also make the website load faster than previously open since the same image will be saved in the application data of browser. This will saved the time for the user to browse between the page of the website without being confused by too many change at once time. 

Image 7a

VS

Image 7b

          The repetition also occur in the font of Aura Kingdom menu as shown in Image 8 which is for every font is bold such as Community, Exploring Azuria, The Game, media and Item mall. This will united the different word close together which show us that they are in the same group as the menu grouping. It also enable the user to distinguished the words that are align in horizontal axis and prevent the user to overlook the words in the menu bar. 

Image 8

V) Contrast

         The principle of contrast is defined as the difference not only to the color but also can be used for any kind of design element such as shape, font and etc. The contrast for color is how to make our eye notice the different in the website and to show the important part of the website. the contrast for color also can be used in image manipulation to ensure that the image become clear and important. The font also can be used to show contrast by using difference font for heading and sub heading, user can differentiate the introduction and detail of the website. 

        For example, in the Aura Kingdom website as shown in the image 9, the background of the website is blur and the character and logo are clear. this will make that the eye of the user will focus on the character and logo. The image is blur by using bird eye view to produce far away image which make it more beautiful when clearer image is put on the blurred image. 

Image 9

      The contrast design for the font is also used by the Aura Kingdom website as shown in the image 10 which is the news 'The Pirate's Loot Tiered Spender Program' and there below goes an explanation 'Only running until the 20th!... Read More »' which automatically aids organization of information  of the words 'The Pirate's Loot Tiered Spender Program'. The shape of the selected video is bigger showing that the video is ready to be streamed and the smaller box show the additional video that available in the website. This will create the focus of the user to stream the video right away compared to the bunch of smaller boxes that are align together. 

Image 10

VI) Space

       The website design principle for space or also known as white space or negative space which is the space that always occurring in the design the moment you open the document or also is the space between the two object or image. The white space have several purpose such as to provide a space without being confronted by too many graphical art, provide readability content which the information able to be delivered completely to the user and ensure all the element matching with each other.

       For example, in the Aura Kingdom website as shown in the image 11 which the video element have rhythm properties that ensure the smooth flow of element in design. the space are provided for the video and the negative space show the video size along with several smaller boxes composed of the additional video align in the horizontal axis. The white space ensure the user to engage easily with the video without being confronted by other graphical art. The box 'Welcome to the Azuria' have white space to ensure the readability of the box content. the words can easily be distinguished from the background and easily recognize and readable by the user.  The background are blurred to provide a space for the character to get an attention from the user when the user browse the website which eventually lead to the character and background to united with each other to provide the design being holistic and agree with each other. 

Image 11

       I think that the website are user friendly especially in term of design since the website use correct alignment for the image so that it will look neat. The website also use good color contrast in which they user able to read the information without any problem. The website also provide a good negative space so that the user will not feel uncomfortable if the information that are put into the website are overloaded.