Overview
Purpose
My purpose is to provide a website where each user can post about their personal life. The purpose of this website is to share content.
Audience
The audience for this site is anyone who is interested in sharing about their life events. It is more targeted toward adults though because the format is going to be sharing a photo with several paragraphs.
Dynamic elements
Dynamic elements provided by JavaScript include adding a new post to the blog. The JavaScript will create a new object that contains all the information added in a "Create New Post" section. Each new post will be added to an array of objects. There will be a child page that will give information about the company and provide a place to send an email to the company. The content of each post needs to persist across page reloads for each user.
Branding
Website Logo
Style Guide
Color Palette
Palette URL: https://coolors.co/0077b6-00b4d8-90e0ef-caf0f8| Primary | Secondary | Accent 1 | Accent 2 |
|---|---|---|---|
| [#0077B6] | [#00B4D8] | [#90E0EF] | [#CAF0F8] |
Typography
Heading Font: Roboto Mono
Paragraph Font: Open Sans
Normal paragraph example
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Colored paragraph example
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Navigation
Content
Home page
Looks like you don't have any blog posts yet. Click the image to create your first one.
Contact Us
Contact Form
Wireframes
Your Posts
The Home Page will originally start out with a blank page with an image placeholder. The text next to the image placeholder is going to say, "Looks like you don't have any blog posts yet. Click here to create your first post." When the user clicks on the box, A modal is going to pop up with a form the user can fill out. The form is going to have a place where the user can upload an image, a place for the user to enter a title for the post, and a place for the user to enter the content of the blog post. The background for each blog post is going to be a light blue with a darker blue for the text. In addition, the website will be dynamic for mobile devices. The Posts will be formatted with just the image and the heading underneath it for mobile devices. If a user clicks on the post, the whole article will show up on their device.
Contact Us
The Contact Us page will have a form where the user can enter their email, a message, and the subject of their message.
