דף הבית
דף פירוט מדריכים
ארכיטקטורת אינפורמציה - דף השיעורים
שיעור חמישי - העיצוב החזותי
|
 |
|
דף הבית
דף פירוט מדריכים
ארכיטקטורת אינפורמציה - דף השיעורים
שיעור חמישי - העיצוב החזותי
|
|
|
ארכיטקטורת אינפורמציה - שיעור חמישי העיצוב החזותי תבנית הדף רישומי עיצוב ודפי דמי מסמך עיצוב עד כאן אתה כבר יודע כמה דברים על האתר שלך: למה אתה בונה אותו, מיהו קהל היעד, מהיהיה על האתר (כלומר, התוכן), ואיך הכל בנוי. אתה עכשיו מוכן לעבוד על העיצוב החזותי (ויזואלי), שהוא בדרך כלל האספקט המהנה ביותר בעיצוב אתרים. אחת מהמטרות העיקריות שלו, הוא לתת לגולשים מושג של מקום. הם צריכים לדעת היכן הם נמצאים באתר, איפה הם כבר היו, ואיך להגיע לאן שהם רוצים להיות. מבנה אתר טוב בצרוף עם עיצוב חזותי אפקטיבי, מאפשר לגולשים לדמיין מפה של האתר. מטרת השיעור הזה היא לקחת את מבנה האתר ולמפות אותו לתוך העיצוב החזותי. קיימים מספר כלים שימושיים ליצירת העיצוב. הצעד הראשון הוא לבנות תבנית דף שתגדיר את המבנה והארגון של האתר כפי שהוא יראה ברמת העמוד. אח"כ תעצב רישומים שיתנו מראה ותחושה כללית. תבנית הדף והרישומים יובילו לדוגמאות עמודים, שיובילו לבניית אתר דמי ברשת. בשלב זה, תצטרך עזרה של מעצבים גרפיים, מנהלי עיצוב (ארט דיירקטורים), כמו גם את צוות ההפקה שלך. תבנית הדף (LAYOUT GRID) LAYOUT GRIDS הם תבניות שמתארים דפי רשת. תוכן - המוקד של כל עמוד - דורש מיקום משמעותי. תצטרך לחסום מקום לניווט גלובאלי ולוקאלי ולהכניס גם אספקטים אחרים של האתר שאולי לא יהיו חלק ממבנה האתר (פרסומות וכד'). מותג החברה חייב להיות על כל עמוד. עסקאות פרסום וספונסרים צריכות להכנס לעיצוב גם כן. הנה דוגמא של תבנית הדף:
נפרדים בתוך האתר צריכים להיות דומים בצורתם בכל החטיבות העיקריות. חזור על מלאי התוכן, ואז נסה להגיע לשניים או שלושה סוגי דפים עיקריים. התחל בעיצוב שלהם ואז השתמש בהם כבסיס לכל סוגי הדפים האחרים. בשלב ראשון, תוציא את מחברת השרטוט שלך או הפעל את תוכנת הגרפיקה האהובה עליך. צייר מלבן שמייצג את הדף, וסמן את מסגרות האלמנטים של העיצוב שלך. מכיוון שהתוכן הוא האלמנט החשוב ביותר שלך, תתחיל איתו - אפילו שזה קצת קשה מכיוון שאתה עדיין לא יודע מה עוד יהיה על הדף. התחשב באלמנטים אחרים אשר חייבים להכלל גם כן - מותג, פרסום וספונסרים, ניווט, כותרות עמוד, גרפיקת ראש עמוד וגרפיקת תחתית עמוד שכוללת זכויות. המותג הוא חלק חשוב בכל עמוד מכיוון שהוא מיידע את הגולשים שהם עדיין באתר. מקום נפוץ למותג הוא הפינה השמאלית העליונה של העמוד. פרסום וספונסרים יכולים להכנס לעמוד בכמה צורות. אולי יש לך מודעת כותרת פרסום מלאה - BANNER (בדרך כלל 468 על 60 תווים) בכל עמוד. האם אתה שם אותה למעלה? האם אתה שם אותה מתחת לכותרת של כל עמוד? איך אתה משלב ספונסרים? האם הספונסרים משולבים בעיצוב הגרפי של הכותרת בכל עמוד? האם יש לוגו ספונסר קטן בתחתית כל עמוד? אלו השאלות עליהן אתה צריך לענות. לבסוף, הניווט גם צריך מקום מרכזי. ניווט גלובאלי חייב להמצא ולהיות עקבי בכל עמוד באתר. שיטות הניווט הלוקאלי יכולות להשתנות, תלוי בתוכן, אבל נסה להיות עקבי ככל האפשר. זהו תהליך משתנה. תצטרך לשנות שוב ושוב את תבניות הדף. קרוב לודאי שתרצה להכין שניים או שלושה סוגים של תבניות, אם יש לך זמן. |
||||
|
||||
|
רישומי עיצוב ודפי דמי רישומי עיצוב משמשים לנתינת המראה וההרגשה של האתר. הם יכולים להיות משולבים במטפורה או ברציונל של מבנה האתר, אבל זה לא תמיד נחוץ. לעיתים קרובות הם נעשים יחד עם יתר תהליך ארכיטקטורת האינפורמציה, כך שאולי כבר יש לך את רישומי העיצוב מוכנים ומאושרים על ידי הלקוח. הרישומים לא חייבים להראות מבנה או ארגון. למרות זה, המעצבים הגרפיים צריכים לדעת את גודל קבצי הגרפיקה, כמו גם מגבלות טכניות. הצעד הבא הוא יצירת דפי דמי, שמייצגים את האתר האמיתי, על ידי שילוב בין רישומי העיצוב ותבניות הדפים. אלו צריכים להדמות כמה שיותר לדפים האמיתיים. השתמש בתוכנה הגרפית האהובה עליך לשבירת הרישומים: נסה לחתוך חלקים מהרישום ולהדביק את החתיכות מעל המקומות המתאימים להם בתבנית הדף. אופציה נוספת היא לבנות את דפי הדמי ב-HTML, ולהשתמש בחתיכות רישומי העיצוב כגרפיקה. דפי הדמי הם הבסיס לאב-טיפוס מבוסס רשת או, אם האתר שלך קטן מספיק, הבסיס לבניית האתר האמיתי. דפי דמי צריכים לעבור את אישור הלקוח, למרות שלעיתים מספיק לקבל אישור על רישומי המבנה והעיצוב של האתר בכדי להתקדם הלאה עם הכנת האב-טיפוס. עכשיו השלמת את הצעדים בעיצוב ארכיטקטורת האינפורמציה של האתר שלך! יש לך את כל החומרים שצריך לבניית אב טיפוס, וכל היתר צריך ליפול למקומו. לפני שאתה צולל לתוך האב טיפוס, הוסף דבר אחד אחרון למסמך העיצוב. מסמך עיצוב כמעט סיימת. אתה רק צריך לתעד במסמך את העיצוב החזותי של האתר. צור פרק חדש במסמך העיצוב שלך שנקרא עיצוב חזותי. תעד בו את תבניות הדפים, וודא שהכנסת גם את הדיאגרמות שהכנת. הוסף את רישומי העיצוב ואת התמונות של דפי הדמי. הוסף תמונות מאב הטיפוס מבוסס הרשת, אם אתה יכול. מסמך העיצוב עכשיו מושלם ונותן תאור מפורט ומעמיק של עיצוב האתר. הוא יהיה שימושי לבנית האתר, להוספת תוכן, ולשינוי האתר כשמגיע הזמן. לדוגמא: 5 עיצוב ויזואלי 5.1 תבניות דפים 5.2 רישומי עיצוב 5.3 דפי דמי 5.4 אב טיפוס מבוסס רשת עכשיו סיימת את השיעור האחרון. כל מה שאתה צריך עכשיו בכדי להיות ארכיטקט אינפורמציה אמיתי, הם הרבה אימונים. |
||||
|
||||
