Ad

Tuesday, May 28, 2013

Just a bit flatter - MVP, Flat Design and Bootstrap on Codediv.com

On my new personal coding tutorial website Code Div , I started fast and quick prototyped the website within 2 hours of exploring the idea, with the help of Twitter Bootstrap and Flat Design. If there's one thing I learnt from Stanford is rapid prototyping. Even our education system - the quarter system- is a constant chasing of cloud.


How to get to the MVP (minimal viable product fast) is perhaps on the mind of every Silicon Valley entrepreneur. Growth Hack... what is that?

The best talk I have heard at Stanford was from material science and design school: prototype generates discussions, and help obtain feedback. Without MVP, we are all but idea people... brilliant, but that's about it. Later on use of MakerBot and 3DPrinting reenforced the idea of using prototyping.

How it is possible that I got the website up and running in 2 hours? Previous I built a Rails Twitter App in 2 days. Okay it wasn't really like Twitter, but that thing worked with 140 characters and allow you to post comments like no other!

I'd be happy to go into details but here's the quick and dirty tip collection, so that the blog post does not run on:

1. Twitter Bootstrap as the first pass of design standard for a new born website
2. Flat Design that focuses on clarity of the information, comparison, call to action, and color schemes that still speak personal, startup, without screaming enterprise and boring, but requires very little design money
3. MVP focus on the core functionalities, even if the backend is not ready yet! My view of the backend is that, without a good architectural solution, the back-end does more harm than good. Until the website is ready security wise to take people's passwords, just DON'T.
4. Do not reinvent the wheel. If there's one thing I learnt as a consultant is that, tested and credible solutions win in Production (deployed websites), experiment in hackathons, but don't go crazy on your real website.

Some flat design pics from CodeDiv.com
This is the 2nd iteration.





The list flat design is worth quite a mention, because it is night and day compare to a flat ordered list, even if styled partially with Twitter Bootstrap. Imagine, the above image, compared with below, the bare bone list....



  • 1 Currently costs $5 for an entire year. May increase later
  • 2 Cloud hosted video library updated frequently
  • 3 Extra media, infographs distributed via MailChimp & Youtube
  • 4 Limited time offer of personalized contents & page
  • 5 Gears towards new beginners of web development
  • 6 Payment info securely handled by PayPal, no info retained
  • 7 No sketchy automatic renewal
  • 8 Purchase is final, refund will NOT be granted
  • 9 Planned topics: HTML | CSS | JavaScript | jQuery | AJAX
  • 10 Planned: Ruby | Ruby on Rails | PHP | CodeIgniter
  • 11 Planned: jQuery Mobile | PhoneGap | API
  • 12 Priority topic: plan for web development bootcamps
  • 13 Priority topic: navigate the career world, in-depth analysis
  • 14 One-time annual subscription for $5, expires after one year
  • 15 A growing collection of video & media resources

Yikes don't even bother with the blob below

And at one point all jumbled up like : Currently costs $5 for an entire year. May increase later. Cloud hosted video library updated frequently. Extra media, infographs distributed via MailChimp & Youtub Limited time offer of personalized contents & page Gears towards new beginners of web development Payment info securely handled by PayPal, no info retaine  No sketchy automatic renewal Purchase is final, refund will NOT be granted Planned topics: HTML | CSS | JavaScript | jQuery | AJAX  Planned: Ruby | Ruby on Rails | PHP | CodeIgniter  Planned: jQuery Mobile | PhoneGap | API  Priority topic: plan for web development bootcamps  Priority topic: navigate the career world, in-depth analysis  One-time annual subscription for $5, expires after one year A growing collection of video & media resoureces

5 comments:

  1. I gotta bookmark this web site it seems very beneficial invaluable https://royalcbd.com/product/cbd-roll-on-gel/

    ReplyDelete
  2. It's good to take increased care for cleaning a fabulous porcelain bath room sink while it scratches quite simply. Avoid choosing steel made of woll, and choose a clean sponge when cleaning out surface marks. Wipe all the sink for circular motions aided by the sponge and certain dish cleaning, then over sink with domestic hot water. If you'll need a nice shine for use on your porcelain submerge, you make use of baking soda along with soft cloth to take out sticky scalp and cleaning scum. Don’t fail to equally clean the underside of all the drain flaps, all the caulk close up, and all the faucet. part time maids in dubai

    ReplyDelete
  3. Well, let us admit that professional website development does not come cheap. But cheapness is a term that represents treacherousness most of the time. Affordability is the key word here. private com

    ReplyDelete
  4. We recently covered the importance of professional website design as well as how a website design company can help you benefit from a customized website. A professional website design company can assist you in leveraging the power of the Internet in a number of ways. Website Design Company Dubai

    ReplyDelete

React UI, UI UX, Reactstrap React Bootstrap

React UI MATERIAL  Install yarn add @material-ui/icons Reactstrap FORMS. Controlled Forms. Uncontrolled Forms.  Columns, grid