My first digital product. Roast my landing page!
Hi folks!
I've been a long time lurker (and occasional participant!) here on IH and was hoping I could get some feedback on a landing page for a product I plan to launch soon.
The history, if anyone is interested: I've been working on building a web app based with Flask, and got sick of trying to adapt existing boilerplate code to my app's needs; each project my needs would be slightly different and the existing stuff would either be deficient in some way or overly complicated, or just poorly documented to make it worth investing my time.
Instead, I ended up writing most of it from scratch and decided to refactor out the boilerplate stuff so I can re-use it easily for future projects. I figured I'd just put the boilerplate code directly up for sale if anyone was interested.
That brings me to my landing page that I'm hoping you can tear apart: https://www.stairstep.io/vial-flask-boilerplate
This is the first time I'm looking to sell something online so I'm looking for feedback on anything from the pitch language/copy, to design, to pricing, to anything that seems missing or lacking.
This is my first ever attempt at selling something online, so any other advice you think might help would also be greatly appreciated! This community also happens to be a decent target audience so your feedback is extra valuable to me!
Thanks and keep up the great work!
Hi! This is a great start! Congrats on getting it out there! Some feedback as I read through it:
Why does this provide? Why would I want it?
This makes me think it has no framework/opinion for how to organize code as my app grows. I generally have a file-per-thing and a folder-per-kind-of-thing.
Was thinking - "what is this?" (Python is not my first language.) I then figured it out - it's for background job and async tasks a la Sidekiq in ruby-land, etc. You might want to have an explainer sentence for python-specific things.
Consider explaining what kind of APIs it generates or has examples for. I didn't see anything which explained what kind of APIs it generates - I searched for and didn't find REST, GraphQL, RPC, or Websocket mentioned in the page.
Does it show good examples of proper testing?
Some ideas of where to take it:
There are a lot of "saas starter kits" in various languages. You might want to add those keywords here, since it's getting into that territory. For python, I've come across https://buildasaasappwithflask.com/ which is structured more like a course.
In rails land, many options: https://boilerplatecode.com/blog/quickly-build-rails-saas
Hey @sbecker, thanks for some really great points that need addressing. Just wanted to reply here to see if you find these arguments convincing.
It's provided as a way to be able to drop into any frontend project if needed (e.g. I prefer Vue.js but someone might prefer React). It is, understandably, not the primary focus of Vial, which is more on the backend side of things. However, when developing my own apps, I've found it useful to have some minimal functions for accessing authentication endpoints.
This, to me, is one of the selling points. Flask unfortunately has no single spec on how to structure larger apps and everyone finds their own slightly different approach as they grow. It's one of the reasons why existing boilerplates can get annoying to suit to your specific needs, and why picking and choosing from different boilerplates becomes a mess. Most of all, it's an unnecessary hindrance in the learning curve when starting out for not much benefit.
Rather than attempt to define just another spec, I incorporate all the recommended best practices (e.g. using blueprints, app factories) but stick with a single file that contains everything. If you prefer a specific organization for the code as you grow, you can do so. For smaller apps, you never have to bother.
Great point here. I'll reword this.
And I guess it's aimed more towards REST API's, but could be used with GraphQL as well.
This is a great suggestion and something I want to add down the line. I think, for now, I'm going to keep the base clean of the complex subscription management code, and will provide it as an addon.
Thanks again for the feedback!
I really like your structure and copy. My one criticism would be that your unDraw illustrations on your pricing plans are completely unthematic and take me out of the narrative of the page. They look dropped in because every landing page needs some undraw illustrations, and don't really serve a purpose.
Hey @danp, thanks for taking the time to comment. I admit, the undraw illustrations in the pricing boxes was just for some visual appeal and to give the boxes some breathing room. I didn't notice how out-of-character it was with the rest of the page. I'll try to find something more cohesive or get rid of it entirely. Thanks!
All good! Overall, really like the page and that was one of the only things that immediately stood out.
Mate, this is a great landing page. Normally i find long-form landing pages to be quite spammy. Yours is focused, and feels much more genuine.
I've actually just this evening tried to set up a flask environment - i normally use php for web dev but thought i'd take a step in to python for the web. So i get this product isn't aimed at a novice like me but i still left feeling this is something I want. That's great.
Hey @rugy, thanks for the feedback! I'm actually curious about your beginner status with Flask. The way I've tried to build and document Vial has been with keeping in mind someone who knows enough basic Flask and Python to develop their app-specific code. That way, this just adds all the missing bits for them. I guess the copy makes it seem like it's aimed at someone far more advanced than yourself?
I remember after reading the hero section i scrolled down to the Who Is This For section where the first line says 'Vial is aimed at developers proficient in building Flask web apps who want to save many hours writing a clean, extensible base on which to base their app.'
I'm definitely not proficient!
That's definitely not what I had in mind. I guess I meant more in the lines of "if you know how to build the core logic of your app (e.g. how to write the todo routes for a todo app), i'll provide you with the rest of the backend scaffolding along with a tutorial explaining everything".
I'll definitely reword :-)
Congrats! It looks good and I like that there is a lot of copy. This is the kind of product that, I think, goes well with long-form landing pages.
My suggestions:
Right at the beginning, I believe it lacks a short sentence stating what Vial is.
The title helps the visitor to identify with the problem.
The first paragraph explains a little bit about the problem.
Then come your product title and tagline.
You continue to expand on the problem.
Only then you state what Vial is: "I will give you a simple, hackable, well-architected, and well-documented Flask API boilerplate that will serve as a rock-solid base for your app's backend."
I would move this sentence just after the logo/tagline.
"Vial is a simple, hackable...."
In the initial paragraphs, you use both "bold" and "underline" to create emphasis. Use just the "bold", the underline makes it look like a hyperlink and adds noise. Maybe also reduce the number of words that you are trying to emphasize.
Move the "FEATURE HIGHLIGHTS" upper to the page. It is a very important input to the buying decision.
You bet that your unique differential is the documentation. That's great; so I would give it for free (in exchange for the email maybe). So the prospect read it and goes "Wow! That is indeed great documentation!"
At the same time, the documentation is worthless without the code. I believe it would act as both a sales pitch and lead generation tool.
I like the questions in the titles, but I think they ask for a short, direct answer in the first line after the question. My suggestions (including changing the order moving the "why..." to the end):
WHO IS THIS FOR?
Developers proficient in building Flask web apps.
<continue with the same copy...>
WHAT WILL I GET? (edited to match the first-person pattern of other questions)
<here just invert the order: images first (they are the short, direct answer) and copy later>
WHAT IS PROVIDED OUT-OF-THE-BOX?
<here I believe you can just cut out the initial paragraph. Images + bullet options seem a great answer already>
WHY SHOULD I BUY THIS?
Save time and starts your project with a well-architected, elegant codebase.
<continue with the same copy...>
I hope it helps! Good luck!
Hey @rodrigo, this is really valuable feedback, and I want to thank you for taking the time to give me a detailed response. I pretty much agree with all your points and I'm glad I got a take from fresh eyes. I'll collate feedback here for a while and make the copy changes you suggested later. I especially agree with your point about documentation being the key selling point.
I was initially concerned about a lot of the code being leaked through public docs (it's sort of "show and tell" style), but it seems stupid now to not openly advertise the strongest aspect of the product. Not to mention the other advantages, like SEO, that it would bring.
Thanks again!
Hello Manohar, I took a quick look at your site looks pretty good. The one issue is the whole site feels long in general - mostly it is how the page is formatted with the amount of copy.
Take a look at this link - https://imgur.com/2p3T8hG I redesigned your page. I took out some of the copy in the hero section. I kept all the copy in the other sections but formatted it differently. This is just a quick redesign of you page - just to provide you another option.
-Paulo
Hey Paolo,
Holy cow, that looks so much better; I love it! Thanks for taking the time and effort to do that! Can I ask how you did it so quickly and your tools/workflow for this kind of stuff? Or did you just code it from scratch (like I'm probably about to do)?
Thanks so much!
I'm not a coder UI/UX Designer - I usually work in Sketch or Adobe XD. But for this I used Photoshop I am much faster in it and built this off a screen shot (I took) of your site. I then quickly chopped the screenshot up to a layout out I like. Then inspected your site to see what fonts you used. Copied and pasted the text off your site into the new layout.
I think the only things I built new was the background hero image, email box (CTA), the white box with shadows in the backgrounds, the pricing section is new and the background that has a very light orange (looks yellow) that is a lighter version of the orange bar you used at the very top.
This comment was deleted 7 years ago