Ruby, Haml, Sass, etc. for rapid prototyping

Hi,

I am quite experienced into HTML+CSS+Javascript, but a total newbie
regarding Ruby, Rails, etc. As a web usability specialst/UX designer, I
usually perform my rapid prototyping tasks using tools like Axure RP.
I’m willing to test a different approach, that would allow the CSS/HTML
to be (at least partially) reused by the front-end developer, and the
prototype to be used/tested directly on target devices. As I work on
mobile/tablet enabled applications, I’d like to try using Zurb’s
Foundation framework.

I followed Ruby and Rails tutorials (some things are just amazing, like
the way database are accessed, some still sound weird but I guess it
would need more practicing), and started studying which Ruby gems I can
use. Rails seems to be too complicated for rapid prototyping (“rapid”
would not be true, I guess…), so it seems using a non-MVC framework,
able to generate static files (like MiddleMan) would be great.

I installed several (Haml, Sass, MiddleMan, Compass, Zurb-Foundation),
and followed the MiddleMan tutorial (’>middleman init testfoundation
–template=foundation-smacss’). But there, when I launch the server
(>middleman server). I get errors, due to lacking SCSS files
(normalize). I opened and changed some files, corrected the first
errors, but there are still other errors. I do not see the
Foundation-related files in the project. I’m pretty stuck! I feel I lack
some basic understanding about what are gems in Ruby, what makes them
available in a project (shall I add them in the config.rb or elsewhere
?). Any advices?

Best regards,
Yann

On Sat, Jan 11, 2014 at 7:02 AM, Yann L. [email protected]
wrote:

Rails seems to be too complicated for rapid prototyping (“rapid”
would not be true, I guess…)

Your unfamiliarity may be an initial obstacle, but I’d say Rails is
perfect for rapid prototyping.

At least it’s my first choice, and I would certainly recommend it
over the static-dump-site approach.

FWIW,

Hi Hassan!

Well, maybe I’ll agree with you in a few months, but for the moment I’d
prefer to avoid the MVC overhead : I usually work in early stages of
projects, when everything is not clear about data/functions/use cases.
The aim is precisely to be able to very quickly present a prototype that
runs and is representative of current design hypothesis. MVC would
clearly be an overhead, especially in my case : I’m really not
comfortable with Ruby (yet?).

AFAIK, my current problem is that the layout makes a call to the
“application” through a stylesheet_link_tag, that generates a
css/application.css" link in the html code. This call gives a 404. It
seems logical as the scss is located in the
/stylesheets/application.css.scss file, and the confir.rb contains :

set :css_dir, ‘css’
set :sass_dir, ‘stylesheets’

But when I set both css_dir and sas_dir in the same directory, I get a
sass syntax error, for a file not found (normalize). :confused:

Hi Panagiotis,

I had a look at Sinatra, which seems really interesting and lighter than
Rails for the kind of use I would make of it, but as far as I can
understand, it does not generate static HTML or CSS files? This is
really a must have, in my case, as it allows me generating a prototype
and sending it to anyone without the least technical dependency,
including situations where I cannot access my customers’ network. A USB
key, and go! :slight_smile:

On Sun, Jan 12, 2014 at 3:08 PM, Yann L.
[email protected]wrote:


Posted via http://www.ruby-forum.com/.

Sinatra is really a single-use sort of thing, although it can generate
views and such, it’s real intent is responding and routing.

Middleman is a static site generator that might be more what you are
looking for. It makes use of Sinatra for it’s preview function, which is
pretty cool, When you build the static site, though, you can zip that up
and mail it to someone, stick it onna stick, etc.

On 11 Ιαν 2014, at 16:02 , Yann L. [email protected] wrote:

(>middleman server). I get errors, due to lacking SCSS files
(normalize). I opened and changed some files, corrected the first
errors, but there are still other errors. I do not see the
Foundation-related files in the project. I’m pretty stuck! I feel I lack
some basic understanding about what are gems in Ruby, what makes them
available in a project (shall I add them in the config.rb or elsewhere
?). Any advices?

Yes, start learning Sinatra [1], it can be easier than rails to
understand, although can be complex enough if needed.

[1] http://www.sinatrarb.com

Best regards,
Yann


Posted via http://www.ruby-forum.com/.

Panagiotis (atmosx) Atmatzidis

email: [email protected]
URL: http://www.convalesco.org
GnuPG ID: 0x1A7BFEC5
gpg --keyserver pgp.mit.edu --recv-keys 1A7BFEC5

2014-01-13 Yann L. [email protected]:

Hi Panagiotis,

I had a look at Sinatra, which seems really interesting and lighter than
Rails for the kind of use I would make of it, but as far as I can
understand, it does not generate static HTML or CSS files? This is
really a must have, in my case, as it allows me generating a prototype
and sending it to anyone without the least technical dependency,

if you want generate static give jekyll a try. http://jekyllrb.com

i already use that for my blog and some project that need fast
prototyping.
you can use YAML front-matter to add some data based on your need.

for example my current project http://ux.haiunair.com/ (it is a
prototype)
all custom data like event title, event organizer etc. are generate from
YAML front-matter from each post. (sample source custom YAML
front-matter
https://raw2.github.com/haiunair/ux.haiunair.com/features/lastest-event/_posts/2014-01-28-dentine-2014.md)

and after jekyll generate all data and build the static site you can
send
that file static site
to your client or you can use gh-pages service to bring your prototype
online (like i did on http://ux.haiunair.com/ ) .

regards,
Bayu Aldi Yansyah,
Universitas Airlangga
blog: atpyk.org
github: @pyk https://github.com/pyk

jekyll, as much as i love it and use it, is not good for haml. Since
haml allows execution of arbitrary code, it will never be included in
the core, and thus you can’t really build layouts and templates with
it.

Instead, I use middleman to get the most web-app-like-but-static-site
experience with haml, sass/compass, coffeescript and so on.

Anyone looking at alternatives to Rails based around Sinatra really
should consider two options:

  1. There are numerous libraries that add to Sinatra, such as:
    Sinatra AssetPack
    Sinatra Support
    Sinatra Ditties
    and many more.
    You can find lots by searching Github.

  2. Use a more full-stack framework built on top of Sinatra, like
    Padrino. Less of the crapgasm that Rails is “maturing” into; much
    closer to the spirit of Sinatra while still giving you nice MVC goodness
    on top.

  3. If you want to stick with an app that uses Rails (as opposed to a
    Rails app), here’s your short reading/viewing list so far:
    “Uncle Bob” Martin’s keynote, Architecture: The Lost Years
    The Obvious Architecture
    Hexagonal Rails, a series of blog posts by Matt W.
    Practical Object-Oriented Design in Ruby: An Agile Primer, by Sandi Metz
    (and anything else she’s written)
    http://objectsonrails.com/, by Avdi G. (and anything else he’s
    written)
    Service-Oriented Design with Ruby and Rails, by Paul Dix (dated but
    still important)
    Growing Object-Oriented Software, Guided by Tests, by Freeman and Pryce

Those are the most valuable companions I’ve had in my learning journey.
Good luck, and may the Source be with you.

Jeff Dickey
Email: [email protected]
More info: https://about.me/jeff_dickey
Blog: https://archlever.blogspot.com/
GnuPG: 31F2 021E C89E 7080 5707 AAE5 70A8 E0AB 8733 5F83

2014-02-03 tamouse pontiki [email protected]:

jekyll, as much as i love it and use it, is not good for haml.

yeah, you were right about that.

Bayu Aldi Yansyah,
Universitas Airlangga
blog: atpyk.org
github: @pyk https://github.com/pyk