Posted on 16-06-2011
Filed Under (Andriod, Miscellenous, News) by admin

Today is a good day for those who like VOiP and are on Android phones , Skype has released their official app for all the Android phones running 2.1 and above especially HTC and Motorola phones .

andriod and Skype

andriod and Skype

The software can be downloaded from Android Market or by going to skype.com/m but here comes the bad news .


For now Samsung Galaxy S is having problems with Skype app for Android and will be fixed in future -

I’ve been using Samsung Galaxy S and all I get is login detials not correct and browser not supported , hopefully the matter will be rectified soon by Skype as they have said “  We’re aware of some problems with the Samsung Galaxy S, and we’re looking to address these in the future. “

For now HTC and Motorola users enjoy .

The required specs to use Skype is 3G ( will work on EDGE)  or WiFi connection ( in US only WiFi is supported due to Verizon )  and processing speed above 600MHZ ( except HTC Hero all HTC phones are capable of it )

Skype for Andriod Phones.

I goggled and found many, and get it copied from a very good helping site (NUFF-RESPEC) for all other designers and developers to get help. Hope you like it .. :)

  • CSS Mania

    The most updated gallery out there. If it posted somewhere else, chances are it made it here first. Before checking any other website, i try to check it out here.. :)

  • css Zen Garden

    It’s not a gallery of websites, but a gallery of content styled in different ways.The Zen of CSS Design:  Visual Enlightenment for the Web.

  • Most Inspired

    I think this design is hideous, but it made it this high because it’s an aggregate of the more popular galleries/Icons and also design concepts out there…

  • CSS Import

    Very good looking gallery, and the ones that make it to the front page are well done. What i like about it is the “Notable Submission” …

  • Piepmatzel

    Just a bunch of thumbnails … but it makes you want to click around…Good collection

  • CSS Galleries

    Another aggregate of CSS galleries … pretty good..

  • The FWA: Favourite Website Awards

    Awesome Design and ideas.. it is mainly Flash websites … but oh so nice … if you looking for insipration then it’s worth a look…

  • Design Snack

    New Designology.. new ideas of many designers.. :)

    CSS Impress

    Simple and Basic. but ideas are new.

  • Light on Dark

    Nice idea of the black and white.. but most of the designs are corporate.. not my type..

    The CSS Gallery List.

    Nice Idea and Design… for submittion and view..

  • CSS Beauty

    Very basic and odd design of the website.. but collection of information is almost good..

  • Spoonr Graphics

    Ever I Visit this blog, there is new piece of information i get.. :)

  • CSS Bloom

    Pretty up to date gallery and good collection of portfolio and information..

  • Unmatched Style

    Site is good, with news and information. but didn’t like the designs too much..

  • CSS Galeri

    Collection is good but the way of showing gallery is not good.

  • Styleboost

    Good to see the gallery design idea.. every design has its own information side by side..

  • Makr

    Not a Gallery, but the way to show the products is awesome. :) .

  • CSS Based

    New ideas .. i like it. :)

  • netzfruehling

    Didn’t like the site design and colors, but collection is good.

  • CSSclip

    I hate the design … but it’s got rating and browse by color and information…

  • The Horizontal Way

    I like the design and the focus on something different… pity it’s not updated that often, or maybe people aren’t quite thinking horizontally…

  • Dark Eye

    Good.. but it requires to login.. which is not userfriendly to get the ideas for new one..

  • CSS Collection

    Old design but good collection and information.

  • Screenalicio.us

    I like the design … and it may be up to date … but without the dating submissions … i doubt i will check this…

  • CSS Gallery

    Good Idea..Pretty looking gallery …

  • CSS Design Yorkshire

    Nice but not very good. Ideas are quite good.

  • CSS Princess

    This may be a good design, but i think i am anti pink … pretty well done though and worth a look…

  • One Pixel Army

    I agree with all the sites they choose to showcase… but nothing new here …

  • Style Crunch

    Don’t like this design at all … but i like that they have DOCTYPE and how it was coded ….

  • najDizajn

    Don’t like the design, but seems pretty up to date…

  • CSSElite

    Very great collection and ideas.. must see

  • CSS Remix

    Nothing new … ok design … fairly up to date …

  • W3C Sites

    I like this collection … but hate the web design … c’mon through in a date ?

  • cool site collection

    Seems to be pretty up to date … don’t like the design .. but they post once a day .. let’s see if that keeps up…

  • CSS Hazard

    I like the look … a little different from the rest … pretty well updated .. worth checking out…

  • Best Web Gallery

    Good design … pretty up to date … but won’t really go here after today …

  • The Best Designs

    Not a fan of this design … pretty updated … worth checking out if you want to view by category…

  • CSS Blast

    Looks promising … no dates … looks very outdated …

  • Lovely Blogs

    I like that it’s focused on blogs … not very updated…

  • CSS smooth operator

    Sites they showcase are ok sites … nothing intrigues me to stay here…

  • css thesis

    i like this design … i like the sites they show case … but lack of date … not coming back …

  • screenfluent

    i love this design … very up to date … but lack of date … won’t come back …

  • WEBTESR.sk

    Seems ugly … didn’t even bother lookng around …

  • liquid designs

    Not a good looking site, but i like their focus …

  • Css Globe

    Very clean good looking site … at a quick glance couldn’t tell what they weer about … which means not going back…

  • Design Shack

    Good design … don’t know how much they update …

  • eduStyle

    ok site … aimed at campus web designers … if that’s what is you market then you could check them out…

  • CSS Drive

    Up to date … but hideous … i didn’t stay around very long…

  • csstux

    Good looking gallery, but how often is updated? bye bye …

  • CSS Flavor

    Not a fan of this design … nothing unique to keep me here

  • my3W

    I stayed here like 1 minute …

  • Pajatti.net

    If i could read japanese i probably would look around…

  • Perfection

    Talk about a cheesy name … sites are actually ok …

  • Wake up Design

    yuck…

  • The Daily Slurp

    Think it’s good but who can stay on something that is so hideous??

  • Web Creme

    Good showcase of sites … cheesy name ugly site…

  • CSS Brain

    Standard design … not that updated …

  • webdesignarchive

    A bland looking website …

  • screenspire.com

    the original one page per site … on home page .. pity it’s no longer updated …

  • Submit CSS™

    A little too web 2.0 // i left right away …

  • StyleTheWeb.com

    Looked promising … but looks like it’s not updated …

  • InspirationKing

    Clean design .. but not updated enogh for me to visit this site …

  • CSSgreen.com

    Don’t like the design … background is so overwhelming i can’t really make out the sites…

  • CSSHeaven

    Don’t like it … nothing new …

  • E-motional Design

    Ugly can’t figure out what s going on here …

  • Proestilo

    Ugly and not updated

  • CSS-demo

    huh??

  • nearly nice.

    is this a joke??


Posted on 17-07-2009
Filed Under (Miscellenous) by admin

Some times ago I wrote a post about a structured process you must know to develop a web application and many readers asked to me to write something simpler about how to manage a small web project. I think there are not general rules for that but, without doubt, a correct approach can help you manage your projects more efficently and achieve quickly the final result.

I prepared this picture that illustrates a simple process with 3 main phases you can use as reference to manage a small web project:

1. Planning

Plan what you have to do, how you have to do it and in which time.

1.1 Define project scope

First step: Identify 4-5 high-level points which define the scope of your project. Don’t underrate the importance of this step because if you are able to describe your project in a nutshell, it means you have a clear idea about what you have to do. So it will be simpler to realize it.

1.2. Identify main features to implement

Second step: Identify main features of your web project and add, for each of them, some details such as relationships, general notes, ecc. For example image to have a simple project with only two main features: user login and profile management. You can represent them in this way:

That’s a simplified example only to give you an idea.

1.3. Define sitemap

Next step: define a sitemap of your project with files and folder. Be accurate in identifying all files to implement (HTML/PHP page, JavaScript files,…) because they are final deliverables to implement.

1.4. Plan a daily to-do list

Set daily milestones using a simple to-do list. So everyday you’ll know exactly what you have to do. In this way, you can easy monitor your progress measuring what you did a certain day and what had to do.

2. Developing and testing

In this phase: write HTML, CSS, PHP, JavaScript… code and test small portions of code during developing (preliminary test). So it wil be simpler find bugs and errors. When your web application is ready, stress it with a final test to catch errors you didn’t find during preliminary test which cause unexpected behaviors .

3. Publishing

Now you are ready to publish your project on-line. When your website or web application is on-line do a last test on what you published to assure you that it’s all ok. That’s all!

If you have some suggestion please leave a comment, thanks!

In this tutorial I want to explain how to implement a simple launching soon page using PHP and jQuery. What’s a launching soon page? In general it’s a page that informs the visitors of a website under construction about when the website is going to be online and allows them to leave their emails in order to be updated when the website is on-line. A typical launching soon page contains a countdown and a form that collects emails from interested visitors. In this tutorial I implemented a launching soon page like this:

Launching Soon!

Launching Soon!

This page is very simple to modify and customize using just some lines of CSS code. You can also add the logo of your company and all elements you want with some lines of HTML code. Download the source code of this tutorial you can customize and reuse in your web project for free!

A little introduction
How I said this package is ready to use and contains these files:

- index.php: the launching soon page final interface (countdow + form)
- config.php: enables database connection
- insert.php: PHP code to add emails into a database table
- js/jquery-1.3.2.min.js: jQuery framework
- js/countdown.js: the countdown script

1. index.php
index.php is the final interface of your launching soon page. How I said it contains a countdown and a form to allow users to leave their emails.

The countdown script
In order to implement the countdown I used this dynamic countdown script that lets you count down to relative events of a future date/time. This future date, while the same for everyone, occurs differently depending on the time zone they’re in. The result is here and it’s fully customizable changing some lines of CSS code:

The only thing you have to do is to add this line of code in the <head> tag of the page:

<script type=“text/javascript” src=“js/countdown.js”></script>

Then, in the tag <body> add the following lines of code to display the countdown:

<div id=“count_down_container”></div>
<script type=“text/javascript”>
var currentyear = new Date().getFullYear()
var target_date = new cdtime(“count_down_container”, “July 6, “+currentyear+” 0:0:00″)
target_date.displaycountdown(“days”, displayCountDown)
</script>
To set a target date you have to change this line modifying July 6 and the hour 0:0:00 with your target date (for example 25 december):
new cdtime(“count_down_container”, “July 6, “+currentyear+” 0:0:00)
…if your target date is 25 December the previous line becomes:
new cdtime(“count_down_container”, “December 25, “+currentyear+” 0:0:00)
If you want to change the style of the countdown you have to modify the following CSS classes:

.count_down{}
.count_down sup{}

In particular .count_down{} changes the format of the numbers and .count_down sup{} changes the style of the text “days”, “hours”, “minutes”.

jQuery and the input form
Ok, the countdown is ready! Next step: add this line of code to include jQuery in the <head> tag of the page:

<script type=“text/javascript” src=“js/jquery-1.3.2.min.js”> </script>

Now, in the tag <body> add a simple form with an input field:

<form id=“submit_leave_email”>
<input id=“input_leave_email” type=“text” class=“input_bg” value=“Add your e-mail address/>
<button type=“submit” class=“input_button”>Update me</button>
</form>

…and add this layer to display a custom message when an user submit the form:

<div id=“update_success”>E-mail added!>/div>

…the result after the submission is here:

The form with the input field disappears with a nice fade-out effect and a success message appears in its place. Now, in the <head> tag, after the line of code that includes jQuery, add this script to enable ajax functionalities to insert emails added from users into a database table without reload the page:

<script type=“text/javascript”>
$(document).ready(function(){

$(“form#submit_leave_email”).submit(function() {
var input_leave_email = $(‘#input_leave_email’).attr(‘value’);
$.ajax({
type: “POST”,
url: “insert.php”,
data:“input_leave_email=”+ input_leave_email,
success: function(){
$(“#submit_leave_email”).fadeOut();
$(“#update_success”).fadeIn();
}
});
return false;
});
});

</script>

2. insert.php
insert.php contains some lines of PHP code to insert an email address into a database table. In this example I created a table EMAIL with just one attribute “email”. PHP code is very simple:

<?php
if(isset($_POST['input_leave_email'])){
/* Connection to Database */
include(‘config.php’);
/* Remove HTML tag to prevent query injection */
$email = strip_tags($_POST['input_leave_email']);

$sql = ‘INSERT INTO WALL (email) VALUES( “‘.$email.‘”)’;
mysql_query($sql);
echo $email;
} else { echo ‘0′; }
?>

Now, remember to modify your database connection parameters in config.php and upload all files on your testing server. Than load index.php and see the result!

That’s all! Download the source code of this tutorial you can customize and reuse in your web project for free! Leave a comment for your suggestions, thanks!


In this post I want to suggest you some interesting tools and resources for web developers. This list includes a CSS framework to design sitemaps using HTML lists, some interesting JavaScript frameworks, some interesting jQuery plug-in, a PHP face detection script, a tutorial to work with the Twitter API and a tutorial about how to retrieve your Gmail emails using PHP.

1. SlickMap CSS, A Visual Sitemapping Tool for Web Developers
SlickMap CSS is a simple stylesheet for displaying finished sitemaps directly from HTML unordered list navigation. It’s suitable for most web sites – accommodating up to three levels of page navigation and additional utility links – and can easily be customized to meet your own individual needs, branding, or style preferences. The general idea of SlickMap CSS is to streamline the web design process by automating the illustration of sitemaps while at the same time allowing for the predevelopment of functional HTML navigation.

2. WaveMaker 5
WaveMaker gives you an easy and productive way to build Web 2.0 applications. Typical applications include a rapid prototyping and development, a form-driven database apps, a front end “face” for SOA architecture.

3. QuickFlip jQuery Plugin
QuickFlip is a jQuery plugin that uses a CSS trick to cause a div, paragraph or any other piece of HTML markup to flip like a card. With a result similar to the UI animation on the iPhone, this jQuery plugin is easily integrated into your webpage to make any portion appear to flip and show its back.

4. Face detection in pure PHP
Maurice Svay released this interesting face detection script to detect automatically faces in photos with PHP.

5. PHP.JS
PHP.JS is an open source project in which we try to port PHP functions to JavaScript. By including the PHP.JS library in your own projects, you can use your favorite PHP functions client-side. Using PHP.JS may speed up development for PHP developers who are increasingly confronted with client-side technology.

6. jQuery Blend
Blend is a jQuery based animation/effects, progressive enhancement plugin for CSS backgrounds (just 1.4KBs).

7. Twitter API: Simple Twitter Search using PHP
This post illustrates how to implement a simple Twitter search and display search results in a web page with a custom format.

8. Flapjax
Flapjax is a new JavaScript framework designed around the demands of modern, client-based Web applications. Its principal features include: Event-driven, reactive evaluation; An event-stream abstraction for communicating with web services; Interfaces to external web services.

9 Glow
Glow is a JavaScript library which aims to make working with JavaScript and the DOM easier. It tries to do this by abstracting common tasks, hiding cross-browser issues, and providing a set of user interface widgets.

10. Retrieve Your Gmail Emails Using PHP and IMAP
Grabbing emails from your Gmail account using PHP is probably easier than you think. Armed with PHP and its IMAP extension, you can retrieve emails from your Gmail account in no time! Take a look at this interesting post of David Walsh.

Do you have any suggestion? Please leave a comment. Thanks!