3d agency website with MODx

This is the fifth website I make with MODx, this time for a French 3d agency.
http://www.3dweave.com/

This project is a bit special as I used it to test a new website creation process that is both SEO-driven and user-centered.

It is the first one on which I used a greyscreen prototype. The whole website was first developed without any graphic element. These were integrated afterwards, using CSS.
MODx makes it quite easy to work this way. I have even created a default "prototype" template to start working from with future projects.

On this project, I also experimented a technique that enabled us to build the site structure in MODx very quickly.

• We first defined the site tree in an Excel document in a visual form
• Once validated by the client, I adjusted the data (still in Excel) placing it in a table with columns matching exactly the ones used in the MODx site_content table
• In this table, I defined several elements such as parent document, isfolder, published, etc. manually
• I exported the data in .csv format
• Using PhpMyAdmin, I imported the data in the modx_site_content table, replacing it entirely.

This enabled us to create a 200+ site tree in a matter of minutes. The Excel document was re-used several times as a base as I had a few errors (especially in document parenting).
I don’t know if this technique is used by other MODx users, but I thought interesting to share it.

The customer is happy with the result, especially as the website performs very well SEO-wise. We currently have a 30% rise in trafic from search engines, whereas the previous version was already well optimized. The website ranks very well on a number of queries and we are working on the others.

Very nice. Thanks for posting on the process with the excel file...interesting concept. There is a module that you may be interested in called ’fast content CSV’.

Great work

Thanks for the ideas on greyscreen prototyping, might try that instead of a traditional graphic type layout.

Nice site! Thx for the detailed and clear info too!

cheers/k

Nice site, and interesting idea about the prototyping. However, I think it’s a misconception that website architecture (structure, content, functionality) can be separated so neatly from visual design (look and feel). Successful design in any field requires a holistic approach since every element informs every other and none can be considered in isolation.

Take traditional architecture; the most interesting buildings being built today marry function to artistic expression in a way that would have been considered indulgent in the modernist era, where form was considered to be purely an expression of function. This is quite a different argument to the separation of content from presentation from business logic that is at the heart of a good website application.

Back to websites: use a pencil and some paper and sketch it out. Collect a bunch of found images and make a mood board. Draw some boxes and link them with lines to work out your data model. The abstraction from the finished result is a *good* thing, because it maximizes creative potential.

You are entirely right therebechips. This was my first try with this method and I do think it needs fine tuning. Working with a graphic designer prior to the prototype design and defining the main website zones and graphic look would certainly help. The main problem is that the prototype should NOT define what the website will look like, only its functionality. But once it is set up, the client tends to cling to it (which happened in this project).

The advantage of this method is that it focuses the client on functionality and avoids the project being bogged down in considerations about minor graphic aspects. I have seen surreal website design meetings where people would spend hours discussing about the colors or the look of icons... things that matter, but will not make a big difference to users. Prototyping clearly avoids that. The other advantage is that, when using a CMS, the client can begin writing content while the website is still in prototype design and while you are working on the graphics. This makes the whole process faster.

I have seen surreal website design meetings where people would spend hours discussing about the colors or the look of icons

Tell me about it! I thought that only happened to me

Very good point about prototyping making the process faster, I hadn’t considered that.

kilroy, that is a very nicely done website. I am very interested by this idea of prototyping. I suppose I’ve thought about it before, but I’ve never really made a clear line between the structure of the site and the look of the site.

In my first website job, I was lucky enough to have the client provide a PowerPoint showing both the structure and look they wanted, but in the case of my current project, the client still has hardly provided anything other than ideas and discussion. This approach would have been very helpful if I focused only on the structure at first.

That’s a nice method of prototyping!!

Interesting. Used grey boxes prototype for a while but what I liked about this was the push for the interactive vanilla demo. I did like the idea of the comment box + note history per page basis. Anyone here done any scripts that can be used on MODx for a similar thing?

_>> doh! I just remembered Jot! duh!