‘Stuffy’ Summary

Stuffy is a Brazilian website where you can organize
and review your favorite products.

Explore, collect and find new cool products, like Books, Shoes, TV Series and Food.
Keep track of your friend’s favorites and opinions about them.

I’ve started Stuffy in Jan 2015, but idea has been developed last year.
Here you can see all parts of the project and completed steps.
From May it was developed more frequently, like almost every week day.

[Check Here What i’ve Studied to Create Stuffy]

[Stuffy Weekly DevLogs]

Last update: Nov 13, 2015

Graphic Design

Logo and Branding (in progress)

I have a great idea for branding, using dark blue and orange, but logo development has been a ******. Its really difficult to create the perfect ideia, so I’m working on it yet.

  • Logo Design (in progress) 
  • Business Cards
  • Social Medias Profiles (in progress)

Web Design & Functionalities

As I am working now as Designer and Front-End Developer, I create just the web design principal ideas in Photoshop, and create next designs directly in CSS. It’s faster and easy to experiment.

Brand’s Page

Home will be the gateway to present Stuffy functionalities. It’s important to keep it clear and focused, showing interactions examples and how it works.

  • Home
  • Category Menu (done!) 
  • Login Box
  • About Page
  • Contact
  • Logout Pages

Categories (almost done!)

Category’s Page is where user will start to look for products. Here I’ll show Most Recent Products Registered, Featured Products, List of Brands and Authors and Count Products that exist in each Category.

  • Category Page (in progress)
  • Last Products (done!)
  • Brand/ Author List (done!) 
  • Count Products / Brands / Authors (done!) 

Search Engine

Find products is the most important action in Stuffy. With this, users can find products that they want to interact.

  • Simple Search System
  • Complex Search Engine (Filters / Tags)
  • Color’s Page  (almost done!)
  • Tags Page  (almost done!)
  • Index Brands / Authors / Actors

Products (almost done!)

Each product has a exclusive page, that shows all informations, interactions, reviews and recommendations. As a 3.0 Web, all products and information will be registered by users.

  • Single Product Page
  • Product Quick View (in progress)
  • Add Product  (done!)
  • Edit Product  (done!)
  • Products Tags / Colors (done!)
  • Fav / Unfav Brands and Authors (done!) 
  • Add TV Series Episodes / Music Tracks (done!) 
  • Add / Edit Books Editions (done!)
  • Actors to Films and Series (new!) (done!)
  • Fav / Unfav Actors (new!)
  • Compilations: Related Products (done!)
  • Fav / Unfav Compilations (done!)

Product’s Images (done!)

Users can upload product’s images and save them in product’s informations. They select image in their own computer, and can crop it directly in web browser. The system saves image in host with a predetermined size and jpg quality.

  • Upload New Image  (done!)
  • Crop Image  (done!)
  • Save New Image on New Product  (done!)
  • Save New Image on Existing Product  (done!) 

Register / Login / Logout (almost done!)

Users need to create an account to interact with products and add new products. They don’t need an account to explore and see product’s informations and reviews.

  • Subscribe New User (done!)
  • Login with Password (done!) 
  • End Session (done!)
  • Register Page
  • Login by Facebook
  • Login by Google+
  • E-mail Confirmation

User Profile

Each user has a profile that show all his/her statistics and interactions. This profile could be Private (that information just could be seen by friends) and Public.

  • User Page Profile (in progress)
  • Edit Profile
  • Edit Settings
  • Private / Public Profile
  • Timeline Feed (done!)
  • Notifications

Interactions (almost done!)

  • Icons and Colors  (done!)
  • Interactions Pages (Completed, Favs, Wishlist, etc) (in progress)
  • Save Product to Interactions  (done!)
  • Progress: Readings  (done!)
  • Progress: Watching Episodes  (done!)

Reviews (almost done!)

An important part is User’s Opinions about Products. Each product has a box that users can send their opinions and score as it’s characteristics. Each category has specific Terms that could be voted (from 1 to 5). This points will be summed by system to define product’s score.

  • Reviews Box on Products Page (done!)
  • Add Review Form (in progress) 
  • Category Terms (done!)

Private Messages (removed)

I decided to remove Private Messages functionalities. I don’t think it will be useful, as the important part of Stuffy is products.


Users can Follow others Users and find their Facebook friends (Facebook is the biggest social network in Brazil). In Product’s Page, users can see whom of their friends interacted with it.

  • Follow / Unfollow
  • Friends Interactions


Gamification Coursera Course helped me a lot with concepts and ideas. Little changes had occurred with some new ideas, but the most is done. Users will receive Experience Points for activities like Add Product and Reviews. A ranking system will endorse those who have the best scores and a Level system will show user’s progress. A badge system will gift user with specific achievements.

  • Experience Points Scores (in progress)
  • Level Definition
  • Badges Definition
  • Achievements Page
  • Rankings and Leaderboards


Users can create Collections to save specific products, and keep track of their progress.

  • Collection’s Page
  • Add / Remove Collection
  • Add Product to Collection
  • Remove Product to Collection
  • Follow Collections

Server & Security

After all systems are done, I’ll transfer it from my localhost to a new server.

  • New Server Transfer
  • Security Revisions
  • Bug Corrections
  • Block Access to Not Logged Users

Admin Backend

Backend is important to keep track of interactions and site evolutions. This part will be just available for administrators.

  • Login System
  • Admin Interface Design
  • User’s Statistics
  • Product’s Statistics
  • Review’s Statistics
  • Level’s Statistics

Marketing and Publicity

These parts will be started when project is almost completed.

  • Social Media Profiles
  • Banner Adversiting
  • Media Kit
  • Promo Videos