A couple of month ago, after finishing (almost) Standfords Saas-class (https://www.coursera.org/course/saas), i decided it was time for my first webapp.
A directory for wordpress themes sounded like a small enough project to start learning everything there is to know about running a webapp. What i learned the last 2 month feels more valuable then 3 years of college. The backend runs on rails, the frontend is done with backbonejs and i'm using mongolab.com as my database-(service).
the skills that i learned so far are mostly technical, now i need to figure out how to get the word out... any pointers on how to do that are very welcome.
I thought i start here since i love how much you help fellow hackers out. any feedback on the app would be highly appretiated.
It's pretty neat, I like the ability to view a lot of themes at once juste scrolling.
One minor thing : when using the filter part, if I tick for example "business" then untick it maybe it should come back to "all" by default instead of showing a blank page?
How do you manage the color detection, do you tag it yourself? For Orange, there's one theme that should not be here : the "screen" one but as the theme is based on pictures "wallpaper" changing maybe one of them has orange in it?
oh thanks, good call with the unticking thing. i didn't even notice that.
the colors are tagged by a script. i wrote a scraper for all of these marketplaces, which collects all the data, takes a screenshot, (tries) to guess the main color and uploads everything... so yeah, if there is a huge example picture with the color orange, my script thinks orange is part of the theme. maybe i can deactivate all images for the color guessing part. i have to figure that out. but thanks for the feedback, really appretiate that!
1) hard to say. i started 2 month ago, and maybe spend about 3 hours a day on average on app-related stuff. when i started i only had little experience in rails, but had absolutly no experience in backbone. so it took me quite a while to get into it.
3) the themes are coming from my rails backend. i have a mongodb database on http://www.mongolab.com. the backbone app makes a request to my rails server and gets a respond as json. you can see how that looks like at http://www.themescroller.com/themes.json
This is a great first app. I assume you are looking for ideas of things to think about and work on next, otherwise I wouldn't criticize. So here are a few ideas:
- Right now you have to click directly on the checkboxes and radio buttons, which are small targets. There is an easy way to let users click on the text next to the checkbox, and a padded area around it a few pixels, which will make them much easier to use.
- You are mostly using the browser-default typography. Most web applications look better with sans-serif fonts, like the ones you see in any menu on a desktop application.
- The url is currently a bit ugly for the default case, with lots of ?blah=all. Can you figure out a way to remove those and just assume "all" as the default if it isn't in the url?
- The filter tab currently has what I would technically describe as "a big jumble of options". Everything looks the same and is the same size, as if you expect all of the options to be equally used and to have the same relationship. Can you think of a way to provide more understandable structure, by making some of the options (the more useful ones) stand out more, and others be out of the way. Or can you find some relationship between the different options that can be expressed visually?
- "Only free themes?" All, Yes, No. Are "all" and "no" the same? Perhaps you mean: All, Free, Paid?
Have fun! I know how exciting a time it is tuning your first big thing. Good luck.
I came to offer advice on your first bullet point. Definitely look into the <label> element. This will let you click on the text associated with the button. Not knocking you here (as this is your first web app!) but I am shocked by the number of large websites that do not do this properly. Drives me bonkers.
You can use it one of two ways. Wrap the text and radio/checkbox button in the <label> tag such as :
Excellent first app! I'm sure you've learned a lot about building it. That would actually really interest me, a blog post perhaps detailing all of the things that you learned while building it.
This is a great first project, and I wish you luck. I have a decent amount of experience with rails and backbone, feel free to email me if you ever have questions or want code reviewed: asolove@gmail.com
Very nice.
Here’s just a small thing I’d change:
You update the url using backbones router.navigate, right?
If you pass {replace: true} in the options object, the browser won’t create a new entry in the history as it does right now but still update the URL.
http://documentcloud.github.com/backbone/#Router-navigate
The user is scrolling one long page, not navigating between 'pages'. Having entries inserted into the history while scrolling seems very counter-intuitive to me.
i think the reason why i did this, was because initially the preview und market links didn't open in a new window. but you're right, if the user is staying on one page, he doesnt need a 'back' functionality.
thanks for the feedback, i already changed it, going to push it later...
I got a question and a feedback :
1/ how do you make money ? Do you get a commission for each theme you sell
2/ It would be great if you had some info about the theme, for example, when I'm looking for a wordpress theme, I want to make sure its design is responsive. You should add some theme info to your app !
1) yes, through affiliate links. most marketplaces give you commission on sales.
2) yes better filters/ more infos is on the roadmap. getting data of ~4000 themes is not a task i want to do by hand. and the infos i get by scraping the sites is limited. but as someone said before, the user doesn't care about how its done, the user cares about how it works. so i'm going to think about that. maybe i let mechanical turks look for all that data.
but for now: there is a filter for responsive themes. its the layout-> responsive layout filter. if you select that, you will get all the themes where i definitly knew that they are responsive.
To get the word out; posting here is a good start. Post on Reddit too. Also, you could try sending a Press Release type email to relevant blogs - they might blog about your app.
Think about SEO and how your site ranks in a Google Search for instance.
If you're sending it out to other blogs, avoid the term 'press release'. It may come with bad connotations from bloggers, who could be getting plenty of random PR already.
Pick the most important theme related sites and hand craft a very concise and to the point email without it looking too generic sounding.
slightly off-topic: i'm not a big reddit user, so i dont know whats what. can you recommend a good subreddit for showing webapps. is there a show-hn-like subreddit?
right, meta tags are also missing at the moment. but generally speaking...its a javascript app, with dynamic content (filters) and only images... the googlebot is not going to apply filters. or maybe he is, i don't know.
I stand corrected. they use Javascript in a headless browser to generate the site previews. Detailed information on how Javascript is interpreted to index sites is hard to find. I would not count on Javascript to instruct Google Bot what to index.
The more I experience it, the more I think the "pinterest-style" layout is absolutely the best way to consume visuals. Great idea and great execution! I would definitely use this.
From the perspective of a dev who occasionally buys from Themeforest, I find a few of the pieces of default TF metadata really important: price, browser support and # of sales (in decreasing order of importance). Don't know how accessible that info is via the API, but it'd be great to access that info without many (or any) clicks.
This is a very nice first web app. Congratulations, you've done fine work.
I will offer one UI design tip. The radio button for All and check boxes for yes/no, etc under the filters tab is not how these ui elements are typically used. Checking Yes and No is all, so there is no need for the All option, just have all the check boxes checked by default and allow the user to uncheck the ones they don't want to see.
A directory for wordpress themes sounded like a small enough project to start learning everything there is to know about running a webapp. What i learned the last 2 month feels more valuable then 3 years of college. The backend runs on rails, the frontend is done with backbonejs and i'm using mongolab.com as my database-(service).
the skills that i learned so far are mostly technical, now i need to figure out how to get the word out... any pointers on how to do that are very welcome.
I thought i start here since i love how much you help fellow hackers out. any feedback on the app would be highly appretiated.