Requirements & Planning: Unfound Sounds

[htmlmt]

Description

The blog Unfound Sounds is a treasure hunt. Posts have two main columns: an album review and a place description. The idea is that the album is hidden somewhere in Omaha, and the reader must decipher where exactly it is. If they find it, that album is theirs to keep.

The home page features nine album titles paired with a square map: the album is hidden within that square. It also links to the Donate popup, the Discover/About page, the "Show More" link, which leads to a simpler Archive page, and links to social media and other outside links.

The Donate popup offers an email link for anyone who wants to donate albums to the project. The Discover/About page more thoroughly explains what the site is.

There's a Post page with the elements shown and listed below including the playable album embed, the Google Maps embed, a Share button and a Found button.

The Found button links to a popup that encourages someone to tweet a photo of the album they found. If they don't have Twitter, an email link will be offered.

Mock-ups

HOME PAGE

POST PAGE

Inspiration

The grid-style home page is appealing in this example: Silk Tricky.

I like symmetrical designs like the post page here: Gareth W. Rice.

A long-long-way-down-the-road goal for this site would be to allow anyone to hide an album and write a post, similar to the social feel of this blog: Faces of NYFW.

Requirements

HOME PAGE Static Blog title Links to Donate popup and Discover/About page Blog description “Show more” link to Archive page Social media icons linked to accounts Footer credit

Dynamic Map images and album titles: linked to posts

POST PAGE Static Blog title Links to Donate popup and Discover/About page Share button (sort of static; won’t need to update manually) Social media icons linked to accounts Footer credit

Dynamic Date album was hidden Byline (plus album donor’s name if given) Album title Place title Album review Place description Rdio embed Google Maps embed Found button linked to popup Found page for this album

ARCHIVE PAGE Static Blog title Links to Donate popup and Discover/About page

Dynamic Album titles in place titles: linked to posts Dates albums were hidden

DISCOVER/ABOUT PAGE Static Blog title Links to Donate and About pages Copy and photos

FOUND POPUP Dynamic Copy Tweet button Email link (if finder doesn’t have Twitter)

DONATE POPUP Static Copy Email link

Planning

• [x] Initialize Sinatra modular --1. Make Gemfile with Sinatra, RSpec and Capybara (latter two in group :test) --2. Run bundle --3. Organize files (make app folder) --4. Set up class which inherits Sinatra::Base in main.rb file --5. Add config.ru file to root, and require './app/main'; run ClassName that inherits Sinatra::Base --6. Run rspec --init, and replace the spec_helper text with RACK_ENV material
• [ ] If test-driven, begin by writing tests. Separate integration tests from unit tests. (Remember to add features folder, in which integration tests live, and require spec_helper.)
• [x] Concept Unfound Sounds app: which specific classes and methods it needs. Expecting that I'll need a Post class, methods in that class could include create_post, edit_post and delete_post. If I decide to password-protect the blog, I would need a User class, which could include methods to add_user, edit_user and delete_user. (Password-protect might be a good second draft feature.)
• [x] Set up database for posts. Expecting to use a posts table with the following columns: id primary key autoincrement (automatically created in ActiveRecord), album_title string, album_cover string, album_review text, place_title string, place_description text, rdio string, map string, date datetime.
• [x] Create routes: get “/”, get “/discover”, get “/donate”, get “/archive”, get “/album/:id”, get “/album/:id/found”, get “/admin”, post "/album" (saves new post; redirect to "/album:id), post "edits post; album/:id" (redirect to "/album:id)
• [x] Create views: home.erb, discover.erb, donate.erb, archive.erb, album.erb, found.erb, admin.erb
• [x] Learn how to password-protect the “/admin” page.
• [x] Write functions to create posts, edit posts, delete posts and password-protect the “/admin” page. Also write code to store images and embed code in the database.
• [ ] Test functions if they're not already tested.
• [x] Construct flow in main.rb.
• [x] Run the main.rb file (and find that it miraculously, incredibly, somehow... didn't work, and then debug, and then fix, and then rejoice).
• [ ] Deploy to Heroku.

[sumeetjain]

:+1:

Excellent work. I'd like to see some progress on this step "Concept Unfound Sounds app: which specific classes and methods it needs." before you move on to coding.

[htmlmt]

Thank you, Sumeet. I've updated my planning section, augmenting the "concept" step, adding a table with columns to the "database" step and refining the "routes" step with which kinds of requests I expect to use.

[sumeetjain]

:+1: Good to go!