This is a website used to sell beats created by the artist directly to an interested party. Based on what I’ve seen on other producer websites and trends regarding websites in 2018, I tried to model my clients website using those ideas. The overall structure will be one continuous scroll. There are individual pages, but they each are stitched together to the bottom of the last page. There are a few links:
- The Home Page
- Beat Store
- Contact
The Home Page: I kept this page simple. I wanted a navigation bar at the top of the screen which a user can use to jump to different sections of the page, I like the idea of the logo being in the center and in the final version I will add a background image which complements the overall website. There is an arrow leading the person to the next section, which is the Beat Store, with an arrow pointing down to indicate that the user can scroll as well.
The Beat Store is the focal point of the website. The navigation bar is something that is present in all pages. This store is designed for someone to listen to samples of the beats they are trying to purchase as well as add multiple songs to a cart and buy them outright. The final version will not have a background image but I will make the background a color that matches the overall theme of the website. The store should be simple to use and will incorporate logos, song names, genres into what the final store front will look like.
The Contact page is designed to be a simple interface at the end of the website which would be a quick way for the user to ask any lingering questions, as well as links to popular social media sites, as most businesses require a social media presence to thrive, I added those links to the user can check out the client if interested. Again, since the entire website is one long scrolling “event” I treated it like a tour, at the end of which they contact would be.
This is what the pages will look like on mobile. The pages will obviously shrink, and the navigation bar will no longer display all options, instead there will be a little “hamburger” logo which, when clicked on, will expand to show the rest of the options. The options of the pages will be tiled on top of another to utilize the smaller space.