UI Design Tips And Tricks

[eluser]TornUp[/eluser]
Hi All,

This isn't really CI related, more web app development in general...
My Question is really in regards to how you handle your user interface, what I mean is that I tend to spend as much time (if not more) designing/coding and debugging my layout… does anyone have any tips on how they build their layouts quickly, I use some frameworks already(I love with a passion the 960GS)

Or do I just have to face facts and admit to myself, building web apps is a 50/50 split between designing the interface and the backend CI code…

Any Tips or tricks, maybe you have a CSS file that is so refined you can drop a standard form element in and it will format the margins and stuff without much customization required?

Many Thanks,
Tom.

[eluser]Zaher Ghaibeh[/eluser]
for me i used to use 960.gs CSS framework , and i still use it , but am so sure hows going to work with me & HTML5, since i didnt do it yet , but am sure it was going to work fine..
when i tried Zend Framework, i was amazed by the ability of creating a simple layout which my all project or some of it will depend on , but this features is for some how is missing in CI , and i cant say that CI can compete with Zend in many acpects but each FrameWork has its advantages and disadvantages.
any way ..
my first project i used a lib to use Smarty3 with CI and it was fine , the next project i found another contribution which is i think it can fill the layout gab which is the CodeIgniter Layout, which i think it will help you to start fast .

thats what i have for now ..

[eluser]Rok Biderman[/eluser]
My answer, use a template library of your choice. You have several to choose from. I use Comper, because it enables me to leave the file structure of the template more or less intact (I could even use html instead of tpl but I don't for security reasons), but there is atleast Phil Sturgeons' and this one.

I have a designer that does most of the frontend work and before it took a lot of time to adapt her designs. She uses 960 and some cssreset thingy to keep the stuff in order. But in reality the design eats up a lot of time if you want to do it right. Might as well get used to it

She now just commits the design onto git server that we use, I then make small adjustments regarding frontpage and detailpages using includes and conditionals and put everything into my structure. I have the more complex data passed trough views in my hmvc structure (i use modular extensions), so I have a kind of skinnable cms with modules at my hand. I'm trying to improve my workflow as I go along, so I'm open to any new suggestions as well.

[eluser]Rok Biderman[/eluser]
[quote author="Zaher Ghaibeh" date="1302895353"]...i found another contribution which is i think it can fill the layout gab which is the CodeIgniter Layout, which i think it will help you to start fast .[/quote]

You have a quick example to go with that? CBA to read trough the library and I couldn't find anything regarding it on forums or the web. The lack of documentation kinda turns me off, though...

[eluser]Zaher Ghaibeh[/eluser]
you dont need to do anything after setting it up ..
it will capture your automatically ...

in your controller you will need to use the view as normal ..
i didnt do anything except editing the layout.php in the config directory to match my code ..

[eluser]Rok Biderman[/eluser]
Thanks, I'll give it a go. Sorry for hijacking your thread, TornUp.

[eluser]tresloukadu[/eluser]
hello i made a template management.. inspired on wordpress.. you upload the theme/folder in views and goes in config and informe the name of the theme/folder and thats it. If u guys have interest i can share the code and ideas.. is kinda simple but is being useful in my projects...

[eluser]Rok Biderman[/eluser]
Please do share how you do it, tresloukadu, I'm really interested in seeing other solutions. I did a similar thing using comper but I can't avoid the feeling that I'm overcomplicating it.

[eluser]tresloukadu[/eluser]
Ok my friend. I'm will have holidays on thursday and friday and I will organize the code to share. Im saving your message with a star to don't forget = )

see you

[eluser]Rok Biderman[/eluser]
Cool, looking forward to it