#ID-Assignment 1: Creating my own website

My website's name: Dreamland, NCT DREAM (fan) website

For my assignment 1, I chose to make a website based on a band and chose the band I really liked: NCT DREAM. The website aims to host basic utilities such as a quick introduction to the band, some recent news/updates involving the band, some of the music they've released and some merchandaise that can be found. 

The website isnt THE most informative and detailed but with the given time I've added as much as I could to still make it for the deadline. It contains some essential information for any new fan however and it's accurate as any information was taken off of research and simply reworded.

Design process/rationale

The colour scheme was not difficult to decide on. Since it is a NCT Dream themed website, I went for the general official colours associated with NCT Dream which is basic black and white and their official colour Pearl Neo Champagne (like a fancy neon green). 

As a fan of the group, I chose to put in some basic information as well so that any fan who access the website can also get access to these information, but they are generally quite well known. I stuck with the same font throughout the website so that the website doesn't look too messy if overloaded with different fonts. Most pages are sectioned into different parts to make it neater but also easy to look for the information one would want.

The website is also easy to navigate thanks to the navigation bar thats on the top of every page.

Features/Pages

The website consists of 5 pages: Home, About, Updates, Discography and Shop

Home: The homepage is the simplest with just the group's photo and their logo.

About: The "ABOUT NCT DREAM" page briefly introduces the group as a whole in a sentence and moves on to the next section that introduces each member briefly with their basic information and some fun facts about them.

Updates: The "UPDATES/NEWS" page consists of 2 sections, the first section just introducing some of the group's newest music they released within the past year, and the second section introduces any information on their latest concerts/performances that they will appear in.

Discography: The "DISCOGRAPHY" page contains a JS-coded Image Carousel that scrolls through some of the albums the group has released and each album can be clicked on to lead to a youtube-music link where the user can listen to the songs on that particular album. Only some of the albums have been added.

Shop: The Shop page features 4 pieces of merchandise that fans can buy and details of each item are displayed when the cursor hovers over the image of the item. If interested, there is an arrow that fans can click on to go to the website that is selling that product.

Credits: IMAGES nctdream logo: https://commons.wikimedia.org/wiki/File:NCT_DREAM_logo.png homepage background: https://kpopping.com/kpics/NCT-Dream-3rd-Album-ISTJ-concept-photos aboutpage group photo: https://twitter.com/ccochopiechan/status/1486998958807613440 individual member photos: https://twitter.com/NCTsmtown_DREAM album covers: we young - https://www.google.com/url?sa=i&url=https%3A%2F%2Fopen.spotify.com%2Falbum%2F2cEYyauffphZuDONGi6z9b&psig=AOvVaw2257fZlgNo-pvOkjzRLc_X&ust=1701529885439000&source=images&cd=vfe&opi=89978449&ved=0CBQQjhxqFwoTCJDLyfTC7oIDFQAAAAAdAAAAABAE we go up - https://www.google.com/url?sa=i&url=https%3A%2F%2Fopen.spotify.com%2Falbum%2F0pIWpPef8UFx8iQ5KSZsYj&psig=AOvVaw37TTpMfGBLnUhEC14hV9wm&ust=1701529898072000&source=images&cd=vfe&opi=89978449&ved=0CBQQjhxqFwoTCIDfwPrC7oIDFQAAAAAdAAAAABAE we boom - https://www.google.com/url?sa=i&url=https%3A%2F%2Fopen.spotify.com%2Falbum%2F31ln9LpD1WyhFlOvDp9YJc&psig=AOvVaw0spEJ327epxKx9hUtzLQ_7&ust=1701529907363000&source=images&cd=vfe&opi=89978449&ved=0CBQQjhxqFwoTCOj___7C7oIDFQAAAAAdAAAAABAE reload - https://www.google.com/url?sa=i&url=https%3A%2F%2Fopen.spotify.com%2Falbum%2F1V5ilz8ghPl1PZJA1hbw3r&psig=AOvVaw0f8-CZr3ZDnE8YKP41-guJ&ust=1701529916173000&source=images&cd=vfe&opi=89978449&ved=0CBQQjhxqFwoTCPiCjYPD7oIDFQAAAAAdAAAAABAE hello future - https://www.google.com/url?sa=i&url=https%3A%2F%2Fopen.spotify.com%2Falbum%2F1fRqXYwoLDxG3EwP70qnjM&psig=AOvVaw3sVVqUW2mU1BhmRSEt6gEJ&ust=1701529925231000&source=images&cd=vfe&opi=89978449&ved=0CBQQjhxqFwoTCNCatYfD7oIDFQAAAAAdAAAAABAE glitch mode - https://www.google.com/url?sa=i&url=https%3A%2F%2Fopen.spotify.com%2Falbum%2F4cAcTMGFjTBufC7Eu0FizU&psig=AOvVaw2cq_2nnJxBBttqVIjAHabo&ust=1701529933456000&source=images&cd=vfe&opi=89978449&ved=0CBQQjhxqFwoTCKChrIvD7oIDFQAAAAAdAAAAABAE candy - https://www.google.com/url?sa=i&url=https%3A%2F%2Fopen.spotify.com%2Falbum%2F6lqazNXadymQLwUh41qW2K&psig=AOvVaw0uxtOBhyvCdBPPBTGdxgbv&ust=1701529940160000&source=images&cd=vfe&opi=89978449&ved=0CBQQjhxqFwoTCMj-xY7D7oIDFQAAAAAdAAAAABAE istj - https://www.google.com/url?sa=i&url=https%3A%2F%2Fopen.spotify.com%2Falbum%2F6RJlrKu60DPF6BMXVdotY7&psig=AOvVaw2va06pn5c50Qv2wvClnyw4&ust=1701529948645000&source=images&cd=vfe&opi=89978449&ved=0CBQQjhxqFwoTCIiEzZLD7oIDFQAAAAAdAAAAABAE merchandise: photobook - https://nctofficial.com/collections/nct-dream/products/nct-dream-the-3rd-album-istj-photobook-ver-introvert-ver-extrovert-ver t-shirt - https://shopidollookbook.com/products/nct-dream-the-dream-show-2-concert-t-shirt?variant=42129173217462 lightstick - https://smglobalshop.com/products/nct-official-fanlight-lightstick seasonsgreetings - https://smglobalshop.com/products/pre-order-nct-dream-2024-seasons-greetings

REFERENCES https://www.w3schools.com/ https://www.youtube.com/@greatdaydesigns https://github.com/