porcupine colors

porcupine colors

ΑρχικήΈργα › Ίδρυμα Μαραγκοπούλου Επικοινωνία »
Ίδρυμα Μαραγκοπούλου

Ιδρυμα Μαραγκοπουλου για τα Δικαιωματα του Ανθρωπου

Το Ίδρυμα Μαραγκοπούλου, μια διαχρονική παρουσία της Ελλάδας στο εξωτερικό, είναι ένα κοινοφελές ίδρυμα με σπουδαίο έργο.

Προαγωγή, προώθηση και προάσπιση των δικαιωμάτων του ανθρώπου

Το Ίδρυμα Μαραγκοπούλου είναι ένα από τα πιο γνωστά κοινωφελή ιδρύματα με συνεχή παρουσία στον ΟΗΕ, στην Unesco και στο Συμβούλιο της Ευρώπης. Υπάρχει για να προωθεί και να προαγάγει τα ανθρώπινα δικαιώματα και την ελευθερία του ανθρώπου σε όλο τον κόσμο χωρίς διακρίσεις. Ολα αυτά μέσα από επιστημονικό διάλογο και μια σειρά ακόμα από δράσεις σε εθνικό και παγκόσμιο επίπεδο.

Ο νέος διαδικτυακός τόπος για το Ίδρυμα Μαραγκοπούλου οφείλει να ανδεικνύει τις δράσεις του, αλλά και το κύρος του ιδρύματος. Να είναι απλός και κατανοητός. Να μπορεί να υποδεχτεί διαφορετικών τύπων περιεχόμενο και να το αποδίδει πάντα αποτελσεματικά ανεξάρτητα από τη συσκευή και την ταχύτητα σύνδεσης του επισκέπτη.

Ίδρυμα Μαραγκοπούλου - Αρχική Σελίδα
Η Αρχική Σελίδα
Θεματικές Ενότητες
Θεματικές Ενότητες
Η σελίδα μίας έκδοσης
Η σελίδα μίας έκδοσης
Η σελίδα της βιβλιοθήκης
Η σελίδα της βιβλιοθήκης

User Interface - User Experience Design

Ποιες ήταν οι σχεδιαστικές απαιτήσεις πριν την έναρξη του project;
Να έχουμε ένα website με σαφή και δικό του χαρακτήρα. Να φαίνεται το κύρος του ιδρύματος. Να αναδεικνύει το πολύπλευρο περιεχόμενο του.

Καλό design σημαίνει ότι πρώτα καθορίζεται σαφώς το είδος του περιεχομένου, η πολυπλοκότητά του και η εσωτερική του δομή. Οπότε μετά αναλαμβάνει το design και δίνει με τρόπο εύληπτο και καλαίσθητο όλες τις διαστάσεις του περιεχομένου.

Ο σχεδιασμός δίνει έμφαση στον ελεύθερο χώρο της οθόνης, ο οποίος ευνοεί την ανάγνωση και την κατανόηση των δράσεων. Το διακριτικό animation δίνει έμφαση σε συγκεκριμένες ενότητες κι επιλεγμένα σημεία του website.
Και βέβαια βασικό στοιχείο του user interface για το Ίδρυμα Μαραγκοπούλου είναι η προσοχή στην τυπογραφία: είναι η ταυτότητα του διαδικτυακού τόπου.

Κώδικας HTML & CSS

Για το project γράφτηκε κώδικας HTML, ο οποίος στην πορεία ενσωματώθηκε στο Σύστημα Διαχείρισης Περιεχομένου, WordPress.

Για το styling γράφτηκε CSS κώδικας με τη μεθοδολογία CSS Grid, η οποία είναι ό,τι πιο εξελιγμένο υπάρχει σήμερα στο συγκεκριμένο χώρο. Τα layouts για τις σελίδες του site είναι πολύ γρήγορα, μπορούν να χρησιμοποιηθούν με πολλούς τρόπους, αλλά και να προσαρμοστούν εύκολα σε κάθε οθόνη. Προφανώς, το mobile κομμάτι ήταν μια προτεραιότητα, καθώς η πλειοψηφία των επισκεπτών μπαίνουν στο website από smartphones.

Στο screenshot, εκτός από το CSS Grid, φαίνεται και η δομή των αρχείων όπως και ο SCSS κώδικας, ο οποίος γίνεται στο τέλος compline σε CSS.

Κώδικας CSS
Κώδικας CSS

Η ομάδα - Τι κάναμε για το Ίδρυμα Μαραγκοπούλου

Όλα τα Case Studies

Case Studies

Σας άρεσε η δουλειά μου;

Επικοινωνηστε μαζι μου

Δείτε ακόμα

Μέγαρο Μουσικής Αθηνών