foundation dev

Inception of Parsel

Foundation revolves around making portfolio websites simply and easily, and allowing maintenance and updates just as seamless. In the initial development phase (here forth referred to as IDP), a lot of thought went in to getting information into the system as quickly and simply as possible. There wasn’t an immediate solution on how to get the data out.

There was also the initial problem of how to empower ordinary people with no coding experience to easily and efficiently make personalized websites for themselves. For as long as Foundation has existed as an idea, the primary means of making your site was imagined to be a drag-and-drop interface similar to that of Drawter (before I knew Drawter existed). This interface would allow outputting grids as proprietary files that could be shared and ultimately used as the baseline for a component-based layout. This was a much more advanced feature that I had no idea how to implement, even as lately as 6 months ago. I put this on the backburner for later.

Parsel was originally incepted as an intermediate, but it was also a foundation. It would first-and-foremost be an engine that the user could use now to get information out of the system. However, it could also be the building blocks for a more advanced drag-and-drop interface, and that’s exactly what it is. Regardless of its ultimate function, ease-of-use, efficiency, and raw power will always be centerpieces of Foundation’s interfacing engine, and every step is laying more Foundation for better and smarter technology.

When starting to develop the original engine, there were a couple different options. The first was to adopt an existing templating engine. Twig , a templating language by the creator of Symfony, was already being used on the backend, so making it user-facing wouldn’t have been much of a problem. Industry-leading Smarty would also ensure that a lot of existing web designers and developers would start out with a fundamental understanding of how to use Foundation. The other option would be to take the Wordpress route and allow the user to access PHP functions to access information.

Neither of these solutions were satisfactory. The user experience and learning curve was similar to that of an actual programming language, and distribution with the Foundation backend would likely be an implementation and licensing nightmare in the future.

Around the same time as IDP, I attended a lecture by Jer Thorp, in which he talked about his roots as a programmer, and mentioned Apple’s early programming language for HyperCard, HyperTalk. Immediately inspired by how HyperTalk uses English grammar for syntax, I began to come up with initial ideas of how Foundation’s templating engine might manifest.

The engine became Parsel. In the next entry, I’ll talk a little bit more on Parsel’s early goals and syntax, and how it began to evolve from there.

[Flash 10 is required to watch video]

Cropper works.

The full Create flow, redesigned.

This is tons better, and I think this is a good new direction for everything to head into for the final iteration.

This took two full days, and there are 37 layer comps. Well worth it, though.

[Flash 10 is required to watch video]

I like this.

[Flash 10 is required to watch video]

I hated it.

Today was a very productive day. I might be getting back into a groove after the events of this semester.

  • Foundation system 100% implemented
  • Structured inputs 100% functional and pulling accurate data
  • “Create Project” Step 1 working and submitting
  • “Create Project” Step 2 working
  • Sketches for Thumbnail uploader and Datepicker UI elements done
  • 7 Foundations have fields defined.

Tomorrow I probably won’t get to do much work, but here are the next steps for Tuesday:

  • “Create Project” Step 2 submitting
  • “Create Project” Step 3 working and submitting (100% Creation)
  • Basic public viewing of projects
  • Mockups for Datepicker and Thumbnail uploader
  • Login/Logout implemented w/UI

And for Thursday:

  • Project Deletion
  • “Edit Project” page almost working
  • “Create Page” working and submitting
  • Implement Datepicker (and hopefully Thumbnail uploader)

I also have some backend settings to take care of that shouldn’t take too long: * User settings: Password change, First/Last Name, Location, etc. * System settings: Current theme, Time Formats, etc

Thinking of dropping Data Structures.

Foundation ♥ dribbble (10/09)

It occured to me that I make shots on dribbble a lot more often than I write on Tumblr. So, here’s where all my Pieces-related dribbble shots are.

Some recent shots:
+ 9072 pixelsLogin IX PrototypeHover to Delete

Drawter

What I’m working towards, Drawter is a Javascript-based tool that allows you to literally draw markup. It is a simple, visual means of laying out a website.

Combine this with a CSS editor and assignable elements (this box is navigation, this box is a photo), and people can easily create websites.

interface

Haven’t posted here in a while. Here, take some interface mockups. More to come. Pictured works by David Yen, because his stuff is cooler than mine.

http://getfoundation.com/

Domain acquired.