Posts Tagged ‘programming’

Free online form builder & website mockup tool: JotForm & Mockingbird

Tuesday, May 18th, 2010

Since I am currently working on several (count eight) web development projects at the same time, life has been hectic but very productive. With my improved energy levels, I’m better motivated to learn and do more things at one go, but I felt that I needed to use more new arsenals in the form of web development tools that I hope can speed up the development process and the project as a whole. Preferably those arsenals are free and goes hand-in-hand with my prototyping methods of finishing my projects.

Wireframe Sketch clipped on my notebook One of the things I don’t really enjoy doing is designing forms. I have to think about client-side validation, and making the fields more appealing and user-friendly with tooltips and whatnot. However, since forms are an integral part of data entry in a web application, I can’t get away without it. And then, there’s the wireframing for layout and functional visualization, very important for documentation. I prefer pencil-sketching. It’s easier to control where everything goes, rather than using my mouse to navigate the precise location of a certain text within Adobe Photoshop or Fireworks. I have wireframing sheets printed out and hand drawn, and I would clip them into my handy-dandy notebook, which, at some point will be overflowing with stuff that it just won’t be practical to drag about.

I’ve just discovered and worked with at least two spiffy apps these past week that made project visualization and forms development much faster and easier for me.

Form created with JotForm JotForm is not only a form builder, but it also hosts the forms and data for you. I personally like the smooth design that comes with the form. It has the ability to not only get those validation and tooltips in, but it highlights the section of the form you are selecting. Once I’m done, I can either just use the embed code, or if I want to integrate the form with my database, I just copy the whole HTML layout with its CSS and JavaScript codes intact into my app, and voila, pretty form. Happy days.

Mockingbird screenshot And wireframing using a computer isn’t as bad as I thought after all. Or maybe it’s just Mockingbird making it easy for me. The widgets and forms that are available for me to use are just enough for me to design a nice website wireframe, and I particularly like the align grids that shows automatically every time I insert a new object in. Once I’m done, I can share the file with anyone I want without having to generate the file as another format and upload it elsewhere. Mockingbird is fast for a web application, most probably because it’s programmed with Cappucino / Cocoa, a relatively new open-source programming framework that runs on a client, giving itself the feel that you’re running a software that’s installed in your computer. Very impressive and very nice.

Evolus’s Pencil and Appnitro’s pForm deserve a special mention here; both look promising and worth a try when I have the time to spare. Pencil is a free prototyping/wireframing tool that to me looks even more powerful and richer than Mockingbird, and runs either as a Firefox addon or standalone app. The free AJAX-powered version of pForm provides a simple click-and-drag way to create forms from a variant of design sets available in the site; the commercial version, in the meantime, has MySQL, e-mail and autoresponder integration for unlimited amount of sites.

  • Share/Bookmark

Back to my roots with Ruby On Rails

Saturday, February 23rd, 2008

I’ve been so caught up with CMS development like WordPress and Joomla since I started blogging, that I haven’t been paying attention to anything else, let alone learning the latest rave in the Web coding world.

It took Photo Matt’s whining about his Dreamweaver predicament to lead me to a web site on Aptana, an open-source development platform and server for developing AJAX enabled Web applications, which then took me to Ruby On Rails resources, where I chose to end up reading a beginner’s guide to developing RoR, called Why’s (Poignant) Guide To Ruby. I tell you, this has got to be the best idiot’s guide to learning a programming language, ever. I can’t believe that I read non-stop till Chapter 3 and I’m still not getting any head ache. Maybe it’s those foxes that keep popping up every once in a while. They’re like breaths of fresh air.

The foxes, courtesy of Why’s (Poignant) Guide to Ruby (http://poignantguide.net/ruby/).

As of this moment, I have to stop myself, because I’ve just realized that I’m missing a mug of my favourite hot drink to keep me company, as well as the fact that I needed to have The Poignant Guide to Ruby site permanently bookmarked somewhere not in my laptop for perpetuity purposes. So here’s my bookmark for Chapter 3. I’m gonna add it in del.icio.us in a while, too.

Ruby on Rails kinda reminds me of Cold Fusion in some ways, without the hefty price tag. Hopefully learning Ruby on Rails will be my first step to becoming an AJAX coding god… dess.

  • Share/Bookmark