code-institute-submissions / mini_project Goto Github PK

#TASK MANAGER

This is a personal task manager for the purpose of managing ones personal life. The idea is that it can be coloured and personalised for each individual to distinguish it from a work task manager. This version is therefore simple and more user friendly and pleasant to look at giving a quick overview of tasks with urgent ones highlighted and easily recognisable.

#UX

##User Stories

##First Time Visitor Goals

As a first time user I want to find it easy to navigate the site and the content should be useful and user friendly. It has to be visually appealing and user friendly to distinguish it from a work task manager.

##Returning Visitor Goals

As a returning visitor I would like to be readily provided with tasks and be quickly drawn to important information. I want it to be easy to filter tasks so I can look at urgent tasks in more detail.

##Frequent User Goals

I would want to have easy access to information and be able to update and amend without difficulty. I would want to be able to protect this information in case I am planning a surprise party or holiday, or prefer for example the details of my mother’s medical needs to be concealed. I would like it to be pleasant to look at.

#Design

##Colour Scheme

I used a simple but bright color scheme. I felt that corporate colors like blue are not the most suitable for a personal task manager. The idea is that should further be designed for other users they would be able to choose their favourite colors as a way of adding a personal touch.

##Typography

To make it more interesting and attractive looking I shadowed the text. Even though it is a personalised task manager I felt that because it is an organisational tool, I would be limited in my creativity and would not want to go over the top. However small extra details with the font would be appropriate.

##Imagery

Imagery is important. Unfortuately I had to tone it down for this type of site. I used the ideas and coding from the Code Institute lessons as felt it took the task manager to the next level, without going over the top. I felt the font awesome icons added a nice touch.

##Wireframes

I used an excel file for the wire frames as I am comfortable and familiar with it and I wanted a vivid clear structure. I have saved it in the wireframe folder as a PDF in the Wireframe folder. I would have used Balsamiq but cannot afford it at the moment and will purchase it later in the year.

##Features

I followed the structure from Code Institute Mini Project so I could have a set up guide and structure. Then I made asthetic changes that I felt were in keeping with the type of information I was presenting.

##Login/Logout

This means if it is a family or a couple, they can have privacy and yet share the task manager. Each can register on the Register page and then once logged in there is a welcome page to make it clear you’re now logged in as yourself

##Home Page

Immediately draws your attention to your tasks, with the important ones highlighted. Also the option to reset or filter tasks is provided.

##Profile

As this can have more than one user, the profile advises which profile you’re in as a married couple for example may choose to have access to each other’s tasks. This may be prefered to ease planning as a couple, however the option for privacy is there with the login password requirement.

##New Tasks

This is where one can easily add new tasks, the page is designed to be aesthetically pleasing as it will be used most often.

##Existing Features

The new task page has the option to highlight whether or not a task is urgent. Login password adds extra security.

##Features Left to Implement

I have left room for more categories to be added and if developing for a client I would offer to design it in their favourite colour, or possibly add an image on their profile page, or give them ability to add it, so if they got a new cat for example they might want to change the image from a holiday picture to a picture of a beloved pet.

##Technologies Used

Font Awesome for icons

https://fontawesome.com/

Materialize

https://materializecss.com/about.html

HTML/CSS/JQuery coding format

MongoDB dataserver

https://www.mongodb.com/

Heroku for Deployment

https://dashboard.heroku.com/apps/flask-task-manager-project-yol/deploy/github

##Image

None

##Code

Used mostly styling and coding from Code Institute Data Centric Mini Project Lesson.

##Code Institute

For the coding, most was borrowed or advised from the modules. The structure and coding was from the Code Institute task manager project.

##Gitpod

Git was used via the Gitpod terminal to commit to Git and Push to GitHub/Heroku.

###GitHub:

GitHub is used to store the projects code after being pushed from Git.

###Heroku:

To deploy the projects code after being pushed from Git.

###MongoDB:

Was used instead of SQL as per requirements and is a more suitable for the type of project.

##Testing

*Did hard reloads on my Heroku app which highlighted errors so I was able to go back and amend the highlighted line of code.

##Deployment

I started out by creating a repository on Github. Set up a new README.md file and used the structure and Gitpod template from Code Institute as a guide. I linked this with Mongo and Heroku, setting up the required details in each. I created a Wireframe in excel, then converted it to PDF so I could drad and drop it to the WireFrame folder I creaded in Gitpod, wanted to use Balsamiq but a fee is required which I could not afford until I get paid next week as I recently moved house. I followed Code Institute lesson format for the structure and coding. I paid close attention to the guidance from the institute and noted the various methods used to make it aesthetically pleasing.

##Credits

###Content

Much of the coding was copied from Code Institute Mini Project lessons and adapted to my prefered asthetics.

###Media

The closest thing to media was font awesome and materialize.com, otherwise no images were used.

##Acknowledgements

• I received inspiration for this project from the Code Institute mini project lesson.

• Tutor support at Code Institute for their continued support throughout the course.

• Asthetically pleasing code from Materialize and Font Awesome