raid-teyar / ValorantWebSiteRemake

We tried to do a remake for the official website of the game [https://playvalorant.com/en-us/] while changing many of the stuff

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Valorant Website remake

VALORANT is a free-to-play first-person tactical shooter video game being developed and published by Riot Games. The game currently runs on Unreal Engine 4.

It was announced on October 15, 2019 under the codename "Project A", until it was officially revealed as VALORANT on March 2, 2020. It was officially released on June 2nd, 2020 for PC.

We tried to do a remake for the officiel website of the game [https://playvalorant.com/en-us/] while changing many of the stuff. You can find here all the sources and files that we used/worked-on.

FIGMA DESIGN FILE

Here you can see the designed file in Figma, We used that design to have an over-view on the project and where it's going. You'll also have all the assets used in the project under the assets page : icons, pictures, colors, charachters ...etc

Details about the Figma file

Figma design link on behance : https://www.behance.net/gallery/125599587/Valorant-website-redesign-V1 Fonts : - Valorant. - Source Sans pro.

Colors : - #101822 - #18212A - #FF4654 - #FF8189 - #ECE8E1

Icons : fontawesome.com - remixicons.com

Assets : Figma design file contains all pages design + assets used. [https://www.figma.com/file/QOPYKo2rizFkj0BTtuTHKO/Valorant-project?node-id=2%3A322]

Details about the Website

This project in it’s first version is our first experience building a game website. So we were pretty excited to code it. Valorant is a popular game, so We sticked to the game theme and colors with some changes, as well as adding a Characters Selection Videos in the first page to show the game more, You will face a new set of characters with every new visit to the page. We added also some music that we got from the game itself and added it to the website, each page with it's own music theme. We tried to add a 3D character to the landing page, but the time wasn't on our side.

The Website contains 4 main pages:

  • About page [Landing page] : has some informations about the game as well as buttons to external pages in case you want to know about it more, Some videos to hype up the website and a special music theme.
  • Agents page : contains the landing for agents with 16 icons which is the total of all game-agents/characters, each agent has his own page which contains more infos about him/her.
  • Guns page: one page contains all the game guns with external links to articles if you are into that stuff.
  • Maps page: contains landing page to introduce maps, and totall of 7 maps page to introduce every map in all angles with a special theme song for every map.

Details about Valorant

Valorant (stylized as VALORANT) is a free-to-play first-person hero shooter developed and published by Riot Games, for Microsoft Windows. First teased under the codename Project A in October 2019, the game began a closed beta period with limited access on April 7, 2020, followed by an official release on June 2, 2020. The development of the game started in 2014.

We can't say it's a website remake since the official game website is way better, But we can say it's a good attempt. We still going to improve the website since it needs that.

THANK YOU FOR READING !!

About

We tried to do a remake for the official website of the game [https://playvalorant.com/en-us/] while changing many of the stuff


Languages

Language:C# 65.2%Language:CSS 20.6%Language:HTML 12.7%Language:JavaScript 1.6%