Ίδρυμα Μαραγκοπούλου για τα Δικαιώματα του Ανθρώπου
Το Ίδρυμα Μαραγκοπούλου, μια διαχρονική παρουσία της Ελλάδας στο εξωτερικό, είναι ένα κοινοφελές ίδρυμα με σπουδαίο έργο.
Προαγωγή, προώθηση και προάσπιση των δικαιωμάτων του ανθρώπου
Το Ίδρυμα Μαραγκοπούλου είναι ένα από τα πιο γνωστά κοινωφελή ιδρύματα με συνεχή παρουσία στον ΟΗΕ, στην Unesco και στο Συμβούλιο της Ευρώπης. Υπάρχει για να προωθεί και να προαγάγει τα ανθρώπινα δικαιώματα και την ελευθερία του ανθρώπου σε όλο τον κόσμο χωρίς διακρίσεις. Ολα αυτά μέσα από επιστημονικό διάλογο και μια σειρά ακόμα από δράσεις σε εθνικό και παγκόσμιο επίπεδο.
Ο νέος διαδικτυακός τόπος για το Ίδρυμα Μαραγκοπούλου οφείλει να ανδεικνύει τις δράσεις του, αλλά και το κύρος του ιδρύματος. Να είναι απλός και κατανοητός. Να μπορεί να υποδεχτεί διαφορετικών τύπων περιεχόμενο και να το αποδίδει πάντα αποτελσεματικά ανεξάρτητα από τη συσκευή και την ταχύτητα σύνδεσης του επισκέπτη.
User Interface - User Experience Design
Ποιες ήταν οι σχεδιαστικές απαιτήσεις πριν την έναρξη του project;
Να έχουμε ένα website με σαφή και δικό του χαρακτήρα. Να φαίνεται το κύρος του ιδρύματος. Να αναδεικνύει το πολύπλευρο περιεχόμενο του.
Καλό design σημαίνει ότι πρώτα καθορίζεται σαφώς το είδος του περιεχομένου, η πολυπλοκότητά του και η εσωτερική του δομή. Οπότε μετά αναλαμβάνει το design και δίνει με τρόπο εύληπτο και καλαίσθητο όλες τις διαστάσεις του περιεχομένου.
Ο σχεδιασμός δίνει έμφαση στον ελεύθερο χώρο της οθόνης, ο οποίος ευνοεί την ανάγνωση και την κατανόηση των δράσεων. Το διακριτικό animation δίνει έμφαση σε συγκεκριμένες ενότητες κι επιλεγμένα σημεία του website.
Και βέβαια βασικό στοιχείο του user interface για το Ίδρυμα Μαραγκοπούλου είναι η προσοχή στην τυπογραφία: είναι η ταυτότητα του διαδικτυακού τόπου.
Style Guide
Μία πολύ ποιοτική γραμματοσειρά σε διαφορετικά βάρη ήταν αρκετή για να δώσει το ύφος που θέλαμε. Απαραίτητη προϋπόθεση: τα σωστά μεγέθη και κυρίως οι σωστές αναλογίες των διαφόρων τυπογραφικών στοιχείων μεταξύ τους.
Ο χρωματικός κώδικας κινήθηκε πολύ κοντά στην εταιρική ταυτότητα με λίγες, αλλά σημαντικές επεκτάσεις. Ουσιαστικά χρησιμοποιούμε την ίδια βάση χρώματος αλλάζοντας τη φωτεινότητα και τον κορεσμό του.
Κώδικας HTML & CSS
Για το project γράφτηκε κώδικας HTML, ο οποίος στην πορεία ενσωματώθηκε στο Σύστημα Διαχείρισης Περιεχομένου, WordPress.
Για το styling γράφτηκε CSS κώδικας με τη μεθοδολογία CSS Grid, η οποία είναι ό,τι πιο εξελιγμένο υπάρχει σήμερα στο συγκεκριμένο χώρο. Τα layouts για τις σελίδες του site είναι πολύ γρήγορα, μπορούν να χρησιμοποιηθούν με πολλούς τρόπους, αλλά και να προσαρμοστούν εύκολα σε κάθε οθόνη. Προφανώς, το mobile κομμάτι ήταν μια προτεραιότητα, καθώς η πλειοψηφία των επισκεπτών μπαίνουν στο website από smartphones.
Στο screenshot, εκτός από το CSS Grid, φαίνεται και η δομή των αρχείων όπως και ο SCSS κώδικας, ο οποίος γίνεται στο τέλος compline σε CSS.
porcupine letter
Το newsletter που έρχεται κάθε 2η Παρασκευή και κάνει τα Σαββατοκύριακα λίγο μεγαλύτερα.
Καλύτερες υπηρεσίες & προϊόντα για το Web
Μαζί σας δημιουργούμε συνεργασίες που βγάζουν στο Διαδίκτυο το καλύτερο σας πρόσωπο. Το πετυχαίνουμε σχεδιάζοντας websites, apps και ψηφιακές υπηρεσίες. Σταθερά, με συνέπεια, με καλή διάθεση. Και κυρίως με αποτελέσματα.
Επικοινωνία: [email protected]