Πώς να κάνετε μια Web φόρμα χρηστικότερη – Good & Usable Web forms design – video

19 Ιανουαρίου 2010 από MaRiaNNa P.

http://videos.visitmix.com/MIX09/C17F

Πατώντας το παραπάνω λινκ θα δείτε ενα βιντεάκι για το σχεδιασμό web forms, όχι μονο για το design αλλα και για το στήσιμο – λειτουργία τους και την βελτίωση τους.
Aρκετά ενδιαφέρον. Για να το δείτε θα σας ζητήσει να κατεβάσετε το silverlight ( ο αντίστοιχος FLASH PLAYER της microsoft)

Είναι λίγο μεγάλο (75min’) αλλα αξίζει.

Top 45 Creative Anti-Smoking Advertisements

19 Ιουνίου 2009 από MaRiaNNa P.

Απολαύστε μερικές απο τις πιο έξυπνες αντι-καπνιστικές  διαφημιστικές αφίσες.

Μερικές απο αυτές βλέπετε παρακάτω.
Όλες θα τις βρείτε εδώ!


On-Line Photoshop μαθήματα μέσω Video! Elislasop.com

2 Ιουνίου 2009 από MaRiaNNa P.

Πολλοί  έχουν την περιέργεια και θα ήθελαν να γνωρίζουν πως γίνονται μερικα απο τα καλύτερα εφε ή οι πιο βασικές διορθώσεις στις φωτογραφίες  μέσω photoshop. Δέν ξέρουν  ομως να χειρίζονται όλοι αυτό το πρόγραμμα, και μαλιστα τοσο καλά .

Γνωρίζοντας απλά τί κάνουν τα εργαλεία του Photoshop και παρακολουθόντας τα video tutorials σε αυτο το Kαταπληκτικό ελληνικό ( επιτέλους) site μπορείτε  να καταφέρετε  και χωρίς πολύ κόπο τη δική σας photo manipulation ( δηλ. να “μεταχείριστείτε – διαχειριστείτε”  τις φωτογραφίες σας ) όπως δεν είχατε φανταστεί !

Με λίγες κινήσεις τα κοκκινα μάτια απο τις αγαπημένες σας φωτογραφίες εξαφανίζονται, και τα κίτρινα δοντάκια του παππού ασπρίζουν και πάλι!

Ο “αφηγητής” με άμεσο τρόπο χωρις δύσκολους όρους και μάλιστα κάποιες φορές με χιούμορ,  εξηγεί απλά και κατανοητά τα βήματα μέσω βίντεο κάθε φορά , ώστε να πετύχουμε το επιθυμητό αποτέλεσμα!

Σε αυτό το site θα βρείτε ακόμη tutorials για πιο …προχωρημένους , για το illustrator, after effects, lightroom, καθώς και μικρά μυστικά του ιντερνετ.

Χρειαζόταν ενα τετοιο site στη γλώσσα μας.

Επισκεφθείτε το στη διεύθυνση http://www.elislasop.com/

GMail Stickers – Δώσε χρώμα στο πληκτρολόγιο σου & Μάθε τα shortcuts του Google!!!

2 Ιουνίου 2009 από MaRiaNNa P.

Στο Επίσημο Blog του Google μπορείτε να διαβάσετε ακριβώς είναι αυτά τα αυτοκολλητάκια! Ομορφαίνουν τον υπολογιστή μας, του δίνουν χρώμα και μας μαθαίνουν και τα Google Mail shortcuts!

Και ακόμα καλύτερα ? Eίναι FREE!!! ( πληρώνετε μόνο το γραμματόσημο για να σας τα στείλουν !)

Διαβάστε πως μπορείτε να αποκτήσετε τα δικά σας εδώ!

Gadget-άκια? Τίποτα δεν είναι αυτό που φαίνεται!!!

22 Ιανουαρίου 2009 από MaRiaNNa P.

Θα πίνατε τον ζεστό ζεστό καφέ σας απο …

κι όμως είναι κούπα!

… τέτοια κούπα ?

Θα σας περνούσε απο το μυαλό πως αυτό δεν είναι ότι φαίνεται αλλα…

χμμμ!!! αρκουδάκι?

…είναι ενα (λίγο μακάβριο ισως? ) USB Stick?

usb ειναι τελικα!!!

Στη διεύθυνση http://www.toxel.com/tech/ μπορείτε να βρείτε φοβερές ιδέες και gadget-ακια !

Μα πού ( και ποιοί) τα σκέφτονται?

Η Ινδονησία, βάζει τα γυαλιά στην Adobe!

10 Νοέμβριου 2008 από MaRiaNNa P.

Σας θυμίζει κάτι η παρακάτω εικόνα?

αν όχι να βοηθησω λιγο…

Μήπως το workspace του Αdobe Photoshop?

Το συγκεκριμένο project εγινε για την εταιρια μεταπωλησης λογισμικου της ινδονησίας για να διαφημίσει το νεό adobe creative suite 4.


Brand: Software-asli.com software reseller
Advertising Agency : Bates141, Jakarta, Indonesia
Creative director : Hendra lesmono
Art Directors : Andreas Junus, Irawandhani Kamarga
Copywriter : Darrick Subrata
Photographer : Anton Ismael

Πολύ ενδιαφέρον εχει επίσης το making of του συγκεκριμένου το οποίο έχει γίνει κυριολεκτικά ” με το χέρι” χωρίς υπολογιστή οπως πολλοι φανταστήκατε!

Δείτε το εδω!
Πιστεύω πως βάζει τα γυαλιά στους διαφημιστες της adobe! Iσως το καλύτερο που εχω συναντήσει στο νετ τους τελευταίους μήνες!

Web Design Basics – Tα βασικά που θα πρέπει να γνωρίζουμε.

3 Νοέμβριου 2008 από MaRiaNNa P.

Το να δημιουργησουμε μια σελίδα ειναι πολύ απλό, μπορούμε μεχρι και να ανοιξουμε το word και να το κανουμε export σαν html.  Άν και δε νομίζω πως σας καλύπτει κάτι τετοιο (μάλιστα το βρίσκω τελείως αντιεπαγγελματικό ειδικά αν εχετε εταιρία!!!):

Το να δημιουργησουμε μια σελίδα που να συμβαδίζει με τη τεχνολογια της εποχής, λίγο πιο δύσκολο και σιγουρα πολύπλοκότερο.
Το να δημιουργήσουμε όμως μια σελίδα με τα παραπάνω ΣΥΝ του να είναι σύμφωνη με τα παγκοσμίως αποδεκτά (τουλαχιστον) κριτήρια αισθητικής – χρώμματος και αρμονίας θέλει παραπάνω σκέψη!

Ψάχνοντας για άρθρα πάνω σε αυτό περισσότερο για να δώ αν ο προβληματισμός έχει κάποια βάση έπεσα σε καποια λινκ τα οποία διαβάζοντάς τα ανακάλυψα πως ναι όντως,
πολλοί προβληματίζονται για τα όρια, τα αποδεκτά, τα όμορφα . Βέβαια η ομορφια ειναι υποκειμενική οπως ολοι ξερουμε, το να κρατάμε όμως κάποια στάνταρ,οπως στην ιδιωτικη μας ζωη πχ το να ειμαστε καθαροί και χτενισμένοι ειναι γενικως αποδεκτο, ειναι σίγουρα ωφέλιμο.

Γιά να δούμε λοιπον κάποια γενικά αποδεκτά στάνταρ όσον αφορά το σχεδιασμό ενός web site!
( το αρχικό άρθρο στα αγγλικά ειναι εδω )

 Περί γραφικών

1. Think small (όπως λέει και το πρωτότυπο κείμενο) 10-12KB για κάθε εικόνα είναι αρκετο.

2. Χρησιμοποιήστε γραφικά τα οποία να ταιριάζουν με το περιεχόμενο της σελίδας. Πχ αν εχω συνεργείο αλλα έχω μια πανέμορφη φωτογραφία μιας τουρτας, δε σημαινει πως θα τη βάλω!

3. Τα πολλά γραφικά στην ιδια σελιδα τα οποια αναβοσβήνουν στριφογυρνανε και κάνουν διάφορα εφέ τα οποία αποσπούν το χρήστη είναι απαγορευτικα!

 Περί layout (“στήσιμο” της σελιδας )

1.Χρησιμοποιήστε κάποιο απο τα δεδομένα και δοκιμασμένα στησίματα πχ δύο στηλες στις άκρες και το περιεχόμενο στη μέση, μπορεί να σας φαίνεται βαρετό αλλα είναι κάτι δοκιμασμένο που δε θα μπερδέψει το χρήστη και θα κάνει τη πλοηγηση ευκολότερη.

2. Χρησιμοποιήστε λευκά! τα κενά μεταξυ γραφικών κειμενου, φλάς κα,  ειναι πολύ σημαντικά στο να μη φαινεται το σαιτ σας μπουκωμένο και στριμωγμενο!

3. Οι φωτογραφίες και τα γραφικά γενικότερα, δέν ειναι απλώς φωτογραφίες. Ειναι στοιχεια του σαιτ σας και πρεπει να τα βλεπετε ετσι. Προσθέστε κείμενο επάνω τους, μετατρέψτε τις σε μπάνερ, φερθείτε τους σαν να ειναι αναποσπαστο κομμάτι.

 Περί γραμματοσειρών

1. Xρησιμοποιήστε απλές και ευκολοδίαβαστες γραμματοσειρες.
πχ Serif γραμματοσειρες για τίτλους

και Sans serif για το κειμενο σας

 Τις διαφορές τους θα τις δείτε με κόκκινο:
.
Με λίγα λόγια οι “ουρίτσες” κάνουν τη διαφορα :)

2. Ο σίγουρος τρόπος για να κάνετε το σαιτ σας να μοιάζει ερασιτεχνικό ειναι το να αλλάζετε χρώμματα, μεγέθη και γραμματοσειρες ! Βάλτε όριο στο πόσες γραμματοσειρές θα υπάρχουν στη σελίδα. 2 Ή 3 το πολύ γραμματοσειρές ειναι πολύ καλά.

3. Επιλέξτε απο τις στάνταρ οικογένειες γραμματοσειρών ( standard font families). Το να επιλέξετε μια γραμματοσειρα όπως η Rockwood LT Standard, είναι εφικτό αλλά κινδυνεύετε να μπορείτε να τη δείτε μόνο εσείς! Όποιος χρήστης δέν διαθέτει τη γραμματοσειρα αυτή στο συστημά του δέν θα βλέπει το αποτέλεσμα που εσείς θέλετε, καθώς ο browser θα του αντικαταστήσει την μη υπάρχουσα γραμματοσειρά με μια άλλη απο τις standard font families οπότε γιατί να μη τις χρησιμοποιήσετε εξαρχής; Οι Verdana, Geneva, Arial, and Helvetica , μπορεί να σας φαινονται συνηθισμένες και βαρετές αλλα ειναι η σίγουρη λύση. 

 Cross-browser Checking

 

Τσεκάρετε αν το σαιτ σας συμπεριφέρεται το ίδιο σε διαφορετικούς browser ή όσο το  δυνατόν ίδιο… Το oτι είστε σίγουροι πως δουλεύει μια χαρα πχ στον xplorer, το να το δείτε μετα με Safari η Mozilla μπορεί να σας μοιάζει με ενα μινι…”εγκεφαλικό”. Και φυσικά πρέπει να σκεφτούμε πως δέν υπάρχουν μονο τα pc αλλα και τα Macintosh, καλό θα ηταν να μπορούμε να τα τσεκάρουμε και εκει. Κατα τη διάρκεια λοιπόν της δημιουργίας κάντε cross-check σε διαφορετικους browser για να αποφυγετε τις πολύ δυσάρεστες εκπλήξεις! ( που μπορεί στο τέλος για να διορθωθούν να ειναι γολγοθάς!) 

Για περισσότερα καθως και για το πώς πρέπει να αντιμετωπίσετε τις διαφημίσεις στα σαιτ ( πχ εάν ειστε κάτοχος καποιου πορταλ που διαφημίζονται εταιριες σε αυτο) μπορείτε να επισκεφθείτε τη διεύθυνση http://webdesign.about.com/od/webdesigntutorials/a/aa070504.htm 

Κάτι διαφορετικό και…Ελληνικό!

16 Οκτωβρίου 2008 από MaRiaNNa P.

Σας ενδιαφέρουν τα Motion grafix? Πόσο καιρο εχετε να δείτε κάτι ελληνικό και συναρπαστικο?
…ή μαλλον κάτι διαφορετικό που μας θυμίζει …ολίγον απο Matrix?

Η εταιρία  παραγωγής motion graphix, Real Creations απο τη Θεσσαλονίκη παρουσιάζει το δικό της δημιούργημα “Moment in Time”.

Bασίζεται (προφανώς) στην ιδέα του  bullet time, όπου ο θεατής βλέπει μία σκηνή να εκτυλίσσεται σε αργή κίνηση ενώ η κάμερα μοιάζει να περιστρέφεται γύρω από το επίκεντρο της σκηνής με κανονική ταχύτητα.

Και το Pathfinder εχει τα …Doodles του!

6 Οκτωβρίου 2008 από MaRiaNNa P.

Oπως και το Google που ειπαμε προχθές, το” δικό μας” ( ελληνικο) pathfinder εχει τα δικα του…εποχιακά λογοτυπα!!!

Σας παρουσιάζω μερικά απο τα πολύ επιτυχημένα

για την  Ημέρα  της Γής.

για την Παγκόσμια Ημέρα Κατά του AIDS.

Για την επέτειο του Πολυτεχνείου

 Για τις εκλογές του 2007

 

 Για το καλοκαίρι

Νομίζω παντως πως τα δικά μας ειναι καλυτερα απο του Google!!!!

Google “Doodle” Logos – Μας αρέσουν!

2 Οκτωβρίου 2008 από MaRiaNNa P.

Google Doodles! Είναι τα λογότυπα που εμφανίζονται στη θέση του κλασσικού google logo και έχουν ξεκινήσει εδω και πολλά χρόνια να μας μαθαίνουν-υπενθυμίζουν κάποιες ιδιέταιρες μέρες  του χρόνου.

Είναι όμορφα, πρωτότυπα και μας αρέσουν πολύ,  μας μαθαίνουν γεγονότα που ποτέ δεν θα ξέραμε τις ημερομηνίες πότε έχουν συμβεί ( ή οτι γενικότερα έχουν συμβεί !), και δίνουν μία νότα έκπληξης στην καθημερινή μας αναζήτηση. Ποιός απο εμάς ξέρει ( ε, ενταξει αν εισαστε πυρηνικός φυσικός δέ μετράει ) ποιά ημερομηνία εφευρέθηκε το πρώτο λέιζερ?

Invention of the First Laser – May 16

 

Σε αυτό το λίνκ http://www.google.com/holidaylogos.html θα βρείτε όλα τα λογότυπα απο το 1999 (!!!! ναι, αλήθεια!)

Μερικά απο τα αγαπημένα μου (για να πάρετε μια ιδέα του τι πρόκειται να δείτε όταν πατήσετε στο λινκ) είναι τα εξής:

50th anniversary of the LEGO brick – January 28, 2008

Earth Day – April 22, 2007

Happy Valentine’s Day – February 14, 2007

 Σίγουρα έχετε πετυχει κάποια απο αυτά εάν είστε google search maniac ;)
Τώρα μπορείτε να βρείτε και το αγαπημένο σας!

Tip (για αρχάριους): Eάν μια μέρα δείτε  ενα νέο λογότυπο αλλα δέν ξέρετε τι συμβολίζει μετακινείστε το ποντίκι σας πάνω στο logo και το Tooltip σας, θα σας δώσει αμέσως την απάντηση.