• About
• User Stories
• Technologies Used
• User Journey
• API
• Wireframes UI/UX
• Website Layout
• Live Website
• Installation
• Team Members

What? ...

This is a crypto currency based website, which provides you the best interface to get a closer lock on the last updates regarding prices, market-caps, daily change rates, volume and many other details.

Why?

Since we are living in the era of speed, it's a must that a professional or even a newbi to the field can easily get an overview and access to almost all needed info about the current situation of crypto market today, all in one and simple place.

How?

Planning Phase:

• We have came with the idea of the website and gathered content through APIs and photos that suits with our application theme.
• Sitemap consisted of 4 pages: Landing page, About page, Contact us page, About page, and Market page.
• Wireframe was sketched first, The application then was designed on the base of the Wireframe in Figma.
• We assessed the tasks we needed to accomplish as well as our skillsets.
• And finally we divided up the workload accordingly.

Development Phase:

The team agreed on guidelines to follow during development. The technologies and guidelines that we agreed to use and follow are:

• HTML5: TO build the basic structure.
• CSS3: To style the website.
• Git & Github: To plan and distribute tasks as a team accordingly.
• Media Query: To make the pages responsive for 3 devices: Mobile, Tablet and Desktop.
• Javascript (JS): To give the functions to all the static elements.
• Local Storage: To save some features and data into local browser.
• API: To fetch the live data.

• have a quick overview of the website including all sections related.
• can get good educational stuff, general info about the website and extra useful resources.
• will have a "capsulated" total data about the current market situation.
• can track the top 20 market-cap coins last updates, such as price, market-cap and volume.
• can track the top 5 gainers and losers in price changes within the last 24 hours.
• also should be able to search about any coin I want and get full details.
• will be able to contact the website admins, and have access to email and social media.

• When user gets to the landing page, there will be many sections, each one presenting a short brief of its page, besides, the navbar which is taking a position at the bottom of the page.
• When clicking on About link, it will take the user directly to its page, and he will find some information about the site .
• Below the home, when he clicks on market button, he will be moving to the most important part of the website, which provides the user with general information about the crypto market, yet, the most needed, such as top 20 market-cap coins, the top 5 gainers and loserless, Market Summary that is located at the top right of page, which pops up once hovering over it or clicking on it and search area where user can search about a certain coin within the whole content of fetched crypto api data using useful features like auto complete and select.
• The last section that contains a link which leads to the Contact Us page.

The First (Search) API. The Second (Crypto) API.

You can check the website Here.

- [git clone https://github.com/GSG-CF04/Climostate.git](https://github.com/GSG-CF05/CryptocurrencySite.git)
- cd CryptocurrencySite
- code .

The great mentor!.

• Aya Enshasy
• Mai Elhajeen
• Omar AbuRabie
• Ali Shbair