Website Research

Website 1:

Nintendo Webpage

https://www.nintendo.co.uk/

The Nintendo website supplies both information and great visuals for its products. You can easily navigate through it and find what you want – either by its images or written information.

If I’m going to nitpick and be critical, one downside I can see is that it is a little bombarding on the menu screen. It has a large amount of bright, colourful images all clustered closely together showing up first thing as soon as you click on the website.

Although there is very little negative space on this website, i wouldn’t particularly say that its a bad thing, as the site is very organized and well arranged. It has a fun, playful look to it but has a mature, structured layout – a combination that works perfectly for a wide age range that Nintendo supplies for.

Inspiration from this website for my own would be its ability to blend both fun and information.

 

Website 2:

SkinnyDip London:

https://www.skinnydiplondon.com/

 

Personally, i find that this website has aesthetically pleasing visuals, its pink and white colour theme and fun feminine feel really brings it together. They style of the website represents its products and image of the company.
From looking at the way the website is made shows that they cater to feminine young adults interested in beauty and fashion. Its fairly obvious to gather this from scrolling just through the homepage.

One negative take away would be its images are just that bit too large and overtaking on the homepage. The initial large image scroll through works well, but as that theme carries on further down it becomes rather tiring to scroll through it all. Other than that i don’t have any complaints on the websites design.

Elements of this website that i want to include in my own, is the fun and fairly feminine visuals.

website 3:

Screen Shot 2018-01-09 at 11.35.54.png

I really like this artists portfolio website, the layout is (word other than perfect) and the colour scheme works nicely. The home page is a lot less busy in comparison to the last two websites i have researched. It is very neat and organized, the categories for the work all present on the home page, a beautiful piece of work of theirs as the top banner and easy to read information beneath their profile pic (which is more of their work). There is no fuss or too many distracting elements from the work.
This concept artist has a wide variety of work in their portfolio, with art ranging from character work to backgrounds and such.

 

Website 4:

LingsCars:

lingscars.com

Screen Shot 2018-01-04 at 10.09.47.png

The site LingsCars is a cars rental site, but there is a lot more to it than just cars.

Visiting the website LingsCars is an unreal experience. There’s information everywhere, every harsh colour that exists, and an abundance of gifs. In a graphic sense its a mess – there is too much going on, everything is overlapping and clashing –  but its not necessarily a bad idea, It’s rememberable and unique, there is nothing like LingsCars. Although there is a lot going on, it does something every business wants: to be remembered. It seems like a terrible idea, but after deeper research and thought as to why this website is like this, its actually genius. It stands out. It grabs everyone’s attention. It turns heads. If this website was pictured next to a few other cars dealership website – LinksCars would be the one people see first. The website itself is one of its biggest marketing points (that and the truck with the missile on it, pictured below).

Ling clearly has a sense of humour that shows itself throughout their website. There are jokes littered on every page. Doing this gives this website and its owner character, making people want to look further for more of its personality.

Overall, its a fun, confusing website that hurts the eyes but you just can’t look away.

 

Website 5:

 

 

 

 

Website 6:

 

 

 

Advertisements

website words

HTML: HyperText Markup Language is the code for website creation.

CSS: Cascading Style Sheets

Bootstrap

Javascript

JQuery

AJAX

 

FTP

 

Database

Client

Web-server

 

PGP SQL

mySQL

 

ASP

 

Angular

 

What do these parts of a website do?

Header/Banner

Logo

Slider

Navigation (menu)

Links

Gallery

Thumbnails

Lightbox – we will be using a tool called Fancybox

Footer

Loader (loading bar)

Social Media Icons

 

What types of media could you show on you portfolio website? Where could you host(?) these things?

For example:

Images = on the website

Video = embedded using an ‘iframe’ from youtube

find 2 or 3 examples of portfolio websites

What is an iframe?

describe what you like about each site

any features you don’t like

any features you would like to include in your portfolio website

 

Responsive web design

Cookies

 

Animal Crossing Trailer Development

animal crossing modboard.jpg

—————————————————————————————————————-

 

Characters

  • Player-noah
  • Harriet the poodle- harri
  • Sable-imogen
  • Brewster- jade
  • Mabel-lulu
  • Tom nook – tom
  • Rover-Harri
  • resseti-lulu

 

—————————————————————————————————————-

 

Scenes

  • Train
    • Meet rover on train
  • Fishing
  • Shop
    • Tom Nook dialogue
    • Shop camera shots
  • Hairdresser
    • Harri goes through the dialogue Harriet the Poodle says at the hairdresser.
    • Player changes hair
  • Clothing shop
    • T and I go through Mabel and Sable dialogue
    • New clothes
  • Café
    • Coffee is served
  • Tree
    • Shaking tree
    • Shot of leaf on ground
    • Leaf turns into chair
  • Snapback to reality
    • Carrying a chair and a shovel
    • Maybe a fish
    • Tired
    • Hair is a messy mess
    • Cuts to animal crossing figurines/amiibos?

 

Scenes in order:

These scenes will be shown more as a montage-ish style in trailer

  • Get off Train (meet Rover?)
  • Empty room (the players house); chucks bag down, sigh at emptiness, leave room.
  • Shakes tree, fruit falls down, & leaf falls down, player picks up leaf but its a chair, puts in pocket.
  • Tom Nooks shop, sells fruit for money (bells)
  • Clothing shop, gets new look
  • Hairdresser, gets new hair
  • Museum
  • Fishing? Reality break through the fishing; becomes dreary and less colourful (Mr Resetti in the background, looking disappointed)
  • Shows Player walking around with a chair, basket of peaches on chair, a flower in their hair(?), tries to replant flowers by throwing it on the ground, people around Player giving them strange looks (maybe filming)
  • Snaps back to bubbly, colourful game and out of Reality with Player in his once empty room that now has his chair in it

 

—————————————————————————————————————-

 

Trailer Feel

Start:

  • Light and fun
  • Bubbly
  • Bright
  • Lots of colour
  • Happy music
  • A faster, peppy, pace (not too quick so you don’t know what’s happening, but quick enough to get a peppy and (*) feel from it.

 

End:

  • Raw
  • Creepy and eerie
  • Happy music continues but it is slightly faded and distant
  • Basically Doki Doki but with animal crossing
  • Mr Resetti
  • Idea that things might not be like they actually seem (like Brandon Roger’s mom video)
  • Yeah i agree ^^^
  • Slower, unsettling pace than when it’s in the game (not too drastic but enough for people to pick up on a noticeable change)
  • Suddenly snaps back to game, pace goes back to what it was before (like the reality break never happened)

 

—————————————————————————————————————-

 

Synopsys/Summary:

‘Bubble Bubble’ App Brief Evaluation

Before this brief i had not worked on any app related projects. both professional or personal wise. It was quite interesting to delve into this style of design and i did enjoy creating the visuals for my app.

‘Bubble Bubble’ is a beverage app made for users to find places to find Bubble Teas and flavor combinations of said drinks.
I stuck to the colour theme i set all through the projects and I am glad i did because these colours fit perfectly with my app genre. I feel that the colours were bright and fun but not harsh on the eyes nor caused any disruption to the layout.

With the logo, i made that in illustrator, but the screens were made in Photoshop. Primarily, i sued the shape tool in both Photoshop and illustrator. I have always been less than comfortable in using illustrator  – especially in comparison to Photoshop.
The text that is used on the screen is (*). Choosing this text was very easy as i knew instantly that (*) was exactly what i was looking for and fit perfectly with the overall aesthetic of my app.

I really enjoyed working in Adobe XD and its a shame that we were unable to use it further in class. We did move onto the program Muse to view the app screens, and personally i didn’t particularly enjoy it as much as the other programs we have used in the past.

My favorite part of this brief was designing the visuals of my app, working on colour combinations, finding the perfect layout, and. Personally i very much prefer to work in the visuals and aesthetics rather than more academic orientated processes like coding and such. I also enjoyed creating the logo, it took a little while to decide what direction i wanted to go for but in the end I am happy with my decision.
I hope to progress in the more creative side of app design as i had a lot of fun with that, and i hope to be more comfortable and skilled with working in newer programs that will aid me in designing similar

Final App Design for ‘Bubble Bubble’

Here is my final piece for the app design brief.

Final Logo:

logo final yeah

For my final logo design i chose to use this style as it has the most fun and eye-catching look in comparison to my other alternations. I made a few very minor changes here and there – such as i made the colour for the lines surrounding the cup and the heart the same dark purple colour, and slightly rotated and shifted the cup to the left.
I am very happy with how this came out, it may not look exactly what i originally envisioned but the path it went down is even better.

 

Final Screens:

 

The design of the final three screens for my app have stuck very closely with the original idea that was first drawn in my sketch book. The designs went through a few minuscule changes, nothing too drastic, just some very minor colour shade alterations and some almost unnoticeable movement with the layout that – at least i feel – brought it all together .

 

 

 

 

Game Trailer ideas

 

Related image

A young girl called Ib visits an art museum with her parents, but suddenly gets transported into an alternate world where all the art in the museum has come to life – all with malicious intent.
Ib meets Gary who’s also trapped in this strange universe, and together they try to escape this place through various puzzles and escaping many enemies.

 

The trailer will include dark lighting, lots of running shots, light eerie music.

A dutch angle with the camera down a long, dark halfway. Gary and Ib can be seen running down in panic, the woman in red painting

 

 

Final Logo Design for ‘Bubble Bubble’

Final Logo design copy background

The final design i have chosen for my app is the last out of the six. The reason why i chose this one is not only because it stuck out the most on the design sheet but because it had the most appealing and memorable look.
I can see this design on something like an enamel pin/broach, or a badge – nothing too big or too small, but regardless of its size i fell as though it would stand out.

 

 

 

 

‘Bubble Bubble’ Logo Designs

bubble tea logo

For my ‘Bubble Bubble’ app i created six logo design with slight alterations between them. I stuck to the pink, purple, and blue pastels colour scheme i have mentioned a few times before both in my book and on this blog. I knew from that start when brainstorming logo ideas that i wanted to make a cup bubble tea the main center piece of the logo, and to have a heart shape be the background.

On my logo design concept sheet above there are only sight differences between each of the six pieces, the main alterations are the line art and arrangement of the bubbles in the bottom of the cup.

Included at the bottom of these logo designs is the exact colours used in the design. I took the code from each colour and put it in the adobe colour wheel, and took a screenshot of it so i always have the exact colours i use for when i further develop the visuals of my app.