Design
Design Archives
La Parada del Mar
1
Website developed for the Spanish Restaurant La Parada del Mar. Customer wanted to have a very simple and direct webpage where to show information about their services.
Website Features
- Prettyphoto Plugin
- AnythingSlider Plugin
- Instant Notification Support
- reCaptcha
- Google Maps
Tweet this!
Less Framework 2
0
All of us know how hard is to get a proper CSS layout for our pages. Thanks to 960 grid system we developers were able to solve some of the issues that we face when we design for different browsers. Now, new devices coming aboard such as Android, iPhones, Blackberry’s and their browsers and the nightmare continues. Nevertheless, nice people like those of 960 grid system give away their approaches and solutions in order to make our life’s easier. Less Framework 2 comes to help us:
A CSS framework for cross-device layouts
Everyone writes CSS differently. Less Framework takes this into account by having a minimal set of features, and does away with things like predefined classes.
No more 960 px
Less Framework uses inline CSS3 media-queries to switch between three layouts:
- a two-column layout at 320 px, for smartphones
- a five-column layout at 768 px, for iPads and netbooks
- and an eight-column layout at 1280 px, for desktops and laptops.
No hacks, unless you want them
Less Framework works beautifully in Firefox, Chrome, Safari, Opera, IE9 (hopefully), Android phones, and all iOS devices (that’s all iPhones, iPads, and iPod Touches). It even behaves nicely in landscape mode.
PalmStudios Model Agency
2I would like to introduce you my last web project: http://www.palmstudios.com
For this project I have developed a sort of MVC (Model View Controller) over the RedBeanPHP DB library (PHP 5.3.2). This project even though it looks quite simple it has a very power CMS (Content Management System) on its backend that allows the model agency to control most of the aspects of its business:
- - Clients Management
- - Models Management (Men, Women, Children & Extras) -contact details, measurements, pictures, and so on…
- - Promotional Packages Management – this is a special addon which allows the agency to create model promotional bundles to send to its clients
There is a ton of client and server libraries that this application makes use of, such as:
- JQuery FancyBox
- JQuery Livequery
- JQuery AjaxQ
- PHPMailer
- RedBeanPHP
- Savant3 Template Engine
- PHPThumb
- TinyMCE
The CMS has a configuration section where site administrator can configure:
- Web site languages (has multiple language support)
- Web site translations (you can even ask GOOGLE about a translation depending of the languages installed on the system)
- Model properties (size, height, waist, etc…)
- Hair Colors
- Eye Colors
- Users
Here is a snapshot gallery of the Site and its CMS
I am open for Freelance Jobs
If any of you would like to create a model agency application like this, let me know, I will be more than happy to collaborate with you on it. I will also sell the source code of its panel for any of you who is interested.
Tweet this! Bookakar.com Finally!
0
Finally, after long time of work, the first release of my own company: bookakar.com.
I have implemented lots of concepts widely spread throughout the Internet and I truly hope that they all work. Still, lot of work to do but as soon as I have spare time I will share with all of you guys lots of PHP and JS bits and pieces that I hope we, all together, could improve in order to make a great Open Source Resource for everybody to use.
For example, I have developed a set of PHP classes that help PHP programmers to implement GMaps without the need of Javascript knowledge.
I can wait to share…
Anyway, any feedback related to my site will be highly appreciated. One more thing and very important: I DO NOT SUPPORT INTERNET EXPLORER due to its security pitfalls on the bank payment gateway and its sillly way of understanding CSS rendering and styles -and I don’t mention its JS engine at all.
Bookakar.com works only on two Spanish areas: Alicante and Ibiza, but it will grow to other areas very soon.
Tweet this!
Visual Lightbox
0
This post is for those who wish to implement a beautiful Lightbox plugin on their site or blog and, unfortunately, do not have a clue about Javascript and/or jQuery and/or Html.
VisualLightBox is a free application that helps you easily generate online photo albums, lightbox gallery with a nice Lightbox-style overlay effect, in a few clicks without writing a single line of code.
Just drag&drop your photos to VisualLightBox wizard window, press “Publish” and your own css web site album with beautiful LightBox effects will open in the browser instantly!
No css, image editing, javascript, html coding, just a click to get your cool web page album ready.
It takes less than a minute to have your own image gallery.
For full documentation please go to http://lightbox2.com/
Newbies, now there is no excuse to have your featured lightbox on your site!
Tweet this!
Ajax Powered Autocomplete Plugin for JQuery.js
3
I am glad to announce the launch of the successfull Ajax Powered Autocomplete for Prototype.js now as a plugin for JQuery. No much to say… if any of you want to have a look at this piece of code you can check it here.
Any feedback is highly appreciated.
Tweet this! Ajax Load -Ajax Loading GIF Generator
0
Who of those of you that use ajax on your projects aren’t looking around the web to find the perfect ‘loading please wait’ GIF for your brand new web application or site? I have to confess that I was one of them. I am not a designer, I can program any web application in a matter of days but when it comes to design… puff… It is the reason why I am always crawling the web for ‘inspiration’.
One of those days crawling I found an online tool created by kath called Ajax Load – Ajax Loading GIF Generator. There you don’t need to worry if you know how to design or not, this simple but very useful tool allows you to select the type of design you want for your ajax loading gif, the foreground and background colors and voilá, your ajax loading gif is ready to download.

For those, like me, without a clue about designing there it is, the Ajax Load – Ajax Loading GIF Generator.
Tweet this! Stripe Generator 2.0
0
The Web 2.0 Stripe Generator is one of those great utilities that some good fellows program for us to use freely. This fantastic tool allow us to create, guess what… yeah, stripes!
If you are new to Web 2.0 nowadays design you may wonder why do you need such tool. Well, sometimes we wish to provide our borring form objects some nice background.
Its interface is self explanatory and very easy to use. What I like the most from this tool is its simplicity.
How to use stripes in our CSS Objects
This is even easier, let’s imagine whe are on Stripe Generator:
- Play with sliders and color pickers, untill you obtain a super-cool stripe tile
- Press “Download” to save your creation
- Edit your css adding this line to the element you want to stripe:
background-image: url("path-to-stripe.png"); - If you want to only repeat horizontally your tile (as in the case of tiles with gradient), you must add this line too:
background-repeat: repeat-x;
Example
The following is a picture taken from the contact section of www.antcut.com. I used the above instructions to set the input fields of my document.

Tweet this! 








