Discoverly

I was doing some changes since I upload the web to github and netlify. I do a few things (like changing sizes and a few categories).

I created a user-system, so now people can sign up on Discoverly thanks to firebase (which is a database). Also the user can log in with their account if they have created before. Also ther’s a page for the user settings, like name, photo, biography and his posts. The user can modify it whenever he wants. Also I implement the likes, so users can give likes to the posts. Finally, there is a section in the main page in which there are the posts with the more likes.

I create a full-functional page for the posts. I improve the design of the upper section which includes the title, filters and navbar with some animations. Now, thanks to a lot of hard work the filters are 100% functional, so you can use them to look for your favourite posts. They can filter by category, date and also change the order. The navbar is functional too so now you can search a word and it will show you posts which includes it. I’m so proud of this because it’s my first big proyect using java script and it’s going so well.

I made the web responsive, so now it doesnt’t matter if the user opens the web on a phone, ipad or laptop, because it’ll look nice. It’s my first time doing a responsive design and I’m so proud of how it looks. I also start improving the posts section, creating an upper section inside it with some filters, search bar and the title. Now I’m gonna do this section useful by making the filters and search bar real.

I did a lot of different things (not as important as the previous but also important). 1. I change the place where the posts appear after they have been created. Now they appear on a different html document where you can go by using the menu. 2. I improve the search bar so the user can search on the posts section and find the post they want. I added some animations and css to make this section better. 3. I added a section which includes more information about Discoverly. It’s located after the categories section, the user can go there by doing click on the button of the beginning. I divided this section in three cards: Que es Discoverly, Su objetivo y Aprender de otra forma. 4. I create the footer at the end of the website, which includes some useful links (not all of them work yet). 5. I do some css changes to make the website prettier (like gradients and box-shadows).

I connected the button of the form to a section which includes posts. Now, when the user fills the form and clicks on the button, the web leads him to home. Now the user is able to go to the posts section and check all the posts which were created by him or by other users. Also if the user clicks on a post he will be able to see it better on a new page, with a bigger post and an exit button to return home.

I spent a lot of time with this section of Discoverly, but I think it’s one of the most important parts and I’m so glad with the result. It consists on a formulary whose objective is to create a post by filling information gaps. The design is the same that the rest of the web, I used the same colors and hover animations more less. I’m so proud of the most visual part of the section, because while your writing the post, you can see at the same time the result which is going to be the other people. Also there are character-counters for some gaps, they also change its color depending on the number of characters. Finally, there is an error message at the end of the formulary, which indicates the user ti fill all the compulsory gaps the post needs. I’mm really proud of this section, it’s my first formulary and I love the connection between it and the post preview. I hope you’ll like it like I do.

I created a section whose goal is to explain the user how to create a post. It includes a title, a brief sentence, an example post, the steps of the creation of a post, the button which lead to the page where posts are created and finally and eslogan.

I improve the posts cards (with some help of chati) giving them a modern and professional appearance. In the future, the user will be able to change a template to write their discoveries, add images, the category… Also my idea is to allow people to give likes and post comments on the posts.

I just do the featured posts section with a few posts. These are temporal, they are only the structure for the future java script-created posts.

I created a section for the different categories of posts. I used a grid for organize these categories (it could be more in the future). Firstly, I do it each one with a different colorful background, but I think it looks better with only one border that indicates the color of the category. I also add some hover to the cards.

I did the web cover, which includes the title of the site, the eslogan, a brief description in spanish (because I’m spanish) of the web functionality and also a button which in the future will guide the user to another place. I’m using a palette of a few colors for now. I create a section with a search bar where the user will be able to search for different articles.

I started the web by creating the main menu. It takes me a time to create the logo, name and brand intention: Discoverly is a site where people can learn new random things and also share their newest own discoveries. It will be organized by sections depend on the category of the knowledge. Every day people will be able to find new articles which have been created by other users. People will be able to upload articles to the blog with their recent discoveries about VERY RANDOM STUFF. With time and effort it will be a lot of articles and categories which people will be able to check and entertain themselves by reading random facts discovered by other people.