האם כל מה שאנחנו יודעים על עיצוב GUI לא נכון?

באמת מצטער על הכותרת הסנסציונית, אבל אני מוצא את עצמי יותר ויותר ביומיים האחרונים מראה בהתלהבות לאנשים חצי מעונינים חלון עם שני טאבים, שאחד מהם ריק והשני מחולק לחצי לבן וחצי עם כפתור אחד. אני חושב שהגיע הזמן להפסיק להציק למכרי הקרובים ולהתחיל להתעלק על הנפשות הטועות שקוראות את הבלוג שלי.

אז ככה – התחלתי ללמוד wxWidgets. זוהי ערכת פיתוח שמאפשר ייצירת ממשקים חלונאיים (GUI) בצורה שאינה תלויית פלטפורמה, כאשר הממשקים יוצאים במראה מקומי על כל פלטפורמה. בעברית, כותבים קוד פעם אחת, הוא נראה כמו תוכנת GTK על לינוקס, כמו תוכנת Windows רגילה על חלונות, וכמו תוכנת OsX על מאק. לא מזה אני מתלהב.

מה שכן מלהיב אותי זו הצורה שבה מייצרים את החלונות (אם רוצים, כמובן). הצורה המסורתית היא לשבת עם עורך WSIWYG (‏What you see is what you get) ולמקם כפתורים על המסך. על פניו, זו הצורה האידאלית לעשות את זה. הבעיה מתחילה ברגע שבו החלון שבו נמצאים הכפתורים צריך גם לשנות את גודלו. בצורה המסורתית, כל הכפתורים ממוקמים יחסית למערכת צירים שמתחילה בפינה השמאלית עליונה של החלון. אם החלון גדל, מה שיקרה זה שכל הכפתורים ישארו במקומם, וייווצר שטח מת מימין ומלמטה לאיזור המכופתר. כך זה ב-Visual Basic, כך זה ב-Visual Studio, וכך זה היה תמיד.

כדי להתמודד עם הבעיה, המתכנת צריך לכתוב כמויות לא קטנות של קוד שמבין מתי היה שינוי גודל של החלון, ומשנה את מיקום הכפתורים ו/או את גודלם בהתאם. יוצא שאחרי שמיקמנו את כל הכפתורים בצורה יפה וגרפית, אנחנו צריכים לכתוב עוד לא מעט קוד שגם ידע לנהל הן את המיקום והן את הגודל של כל כפתור וכפתור. בסיכומו של דבר, יותר טוב מאשר לנהל הן את המיקום הראשוני והן את הגודל, אבל לא בהרבה.

השיטה של wxWidgets מזכירה קצת HTML. במקום לספר למערכת אילו כפתורים יש ואיפה הם נמצאים, אנחנו מספרים למערכת מהו המבנה העקרוני של החלון. אנחנו יכולים לייצר אזורים אנכיים ואזורים אופקיים, ולהגדיר היררכיות (לדוגמא, איזור אנכי שמגדיר “שורות” יורדות, שבו יש אזורים אופקיים שמגדירים כל “שורה”, ובתוך אחת השורות אפשר עוד למקם איזור אנכי לכפתורים ספציפיים). החלק הבאמת יפה הוא שברגע שהגדרנו את זה כך, המערכת עצמה תדע אלו כפתורים להגדיל ואלו להזיז כאשר גודל החלון משתנה. היא גם תדע מהו הגודל המינימלי שהגיוני להגדיר לחלון. במילים אחרות, סט שלם של ניהול שהיה כאב ראש מאוד גדול ומאוד לא קשור למה שהתוכנה בעצם עושה נחסך לנו.

רק למען ההגינות, נראה כאילו בגרסה שעכשיו מיקרוסופט מנסה לדחוף של ‎.Net הם הכניסו משהו מאוד דומה. מכיוון שנראה כאילו שב-wxWidgets יש את זה כבר כמה שנים, תזכרו מי העתיק ממי….

שחר

מאת

שחר שמש

מייסד–שותף וחבר ועד בתנועה לזכויות דיגיטליות מייסד שותף בעמותת „המקור”. פעיל קוד פתוח. מפתח שפת התכנות Practical

11 תגובות בנושא “האם כל מה שאנחנו יודעים על עיצוב GUI לא נכון?”

  1. אני לא חושב שזה מקורי של הטולקיט הזה.
    תסתכל על ג’אווה, כבר בגרסא הראשונה היו שם LayoutManagers שאחראים לעשות בדיוק את מה שתארת (והגרסא יצאה בסביבות 95).
    תסתכל פה למשל:
    http://java.sun.com/docs/books/tutorial/uiswing/layout/using.html

    למעשה, לא בטוח אפילו שזה מקורי של סאן.
    כנראה גם הם גנבו את זה מאיפשהו.
    זה די מתבקש.

      1. ג’אווה לקחו את זה מ-Motif (או לפחות ב-Motif היה את זה לפני שג’אווה הומצאה, ובעצם שאני נזכר בזה עכשיו אז הג’אווה הראשון בא עם ממשק ל-Motif, עד כמה שאני זוכר).
        ב-Motif יש "Manager Widgets" שכל התפקיד שלהן זה לאמר ל-Widgets שתחת אחריותן איזה מקום ואיזה גודל הוקצב להן. יש כמה סוגים של Manager Widgets שכל אחת מנהלת את ה"בנים" שלה לפי "מדיניות" שממומשת בקוד שלה. נדמה לי שה-Widget הכי פופולארי והכי גמיש מהבחינה הזו היה ה-FormWidget (אני לוקח את השם לפי מה שמצלצל לי מוכר בעמוד הבא: http://tinyurl.com/blcdk). בין אם אני זוכר את השם הנכון או לא – הכוונה ל-Manager Widget שאיפשר לכל "בן" לאמר "אני רוצה להיות מימין לבן ההוא" או "אני רוצה להיות 5 פיקסלים מתחת ל-א למשמאל ל-ב". כל מה שהבנים אמרו נלקח בחשבון כ-"בקשות" של הבנים ע"י המנהל, שהיה אפילו יכול לנהל משא ומתן עם הבנים.

        עכשיו מי העתיק ממי? 🙂

        נשמע לי מוזר שרק עכשיו מיקרוסופט הכניסו תכונה כזו בסיסית (ניהול גמישות במיקום וגודל ה-Widgets) רק עכשיו –

    1. כמו שכתבתי למעלה – זה באמת היה ב-Motif.

      Athena נכתבה רק כבדיקה של תשתית ה-Widgets של X11 ומעולם לא היתה כוונה להפוך אותה למשהו רשמי כפי שזה התגלגל.

  2. – אני מכיר ומשתמש ב wxWidgets כבר מספר שנים (עוד מהתקופה שהם נקראו wxWindows).
    – בתחילה wxWindows לא תמך ב Layout.
    – הקונספט הועתק מ Java שם הוא קיים, למיטב ידיעתי, עוד מתקופת AWT (לפני ה Swing).

    1. כל הבאסה שנרשמת לבלוג טכנולוגי http://israblog.nana.co.il/moodicons/blink.gif">

      תחשבי על זה כמו על ההבדל בין להגיד לתוכנה איפה למקם כל כפתור, לבין להסביר לתוכנה איך את ממקמת כפתורים. במקרה השני, אם מישהו משנה את גודל החלון, התוכנה כבר תדע לבד מה לעשות, מכיוון שלא לימדת אותה רק איפה צריך לבוא כל דבר בגודל נתון, אלא איך את מחליטה איפה לשים דברים בכל גודל.

      אני מקווה שזה עוזר.

      שחר

      1. נסיון אחר להסביר – תחשבי על מלצרית שמלמדים אותה לערוך שולחן – אם אומרים לה רק "הכף הראשונה נמצאת ככה וככה מימין לקצה והכף השניה ככה וככה (כפול שתיים) מימין לקצה" וכו’ וגו’ אז יופי – אבל מה אם המסעדה קונה יום אחד שולחן עם צורה קצת שונה? המלצרית לא תדע איך להתאים את מה שהיא למדה עם שולחן בגודל שונה כי תמיד אמרו לה בדיוק איפה כל כף צריכה להיות ולא מה העקרון שצריך להיות (למשל "לכל סועד מוקצה כך וכך מקום, הכף נמצאת בקצה הימני של המקום הזה והמזלג בקצה השמאלי" וכו’ וגו’) אם מסבירים למלצרית את העקרון אז היא יכולה לממש אותו בכל מני גדלים של שולחן ובכל מני מצבים (למשל אורחים מבקשים לצופף יותר אנשים על שולחן – אז מקצים לכל אורח קצת פחות, או השולחן הוא עגול אז מקצים מקומות בסדר שונה)

        קפיש?

  3. הקונספט המתואר קיים מזה שנים, בשפות ובחבילות תוכנה שונות.
    צריך לשנות את הכותרת: "האם כל מה שאני יודע על עיצוב GUI לא נכון?"
     
    (גם הפסקה האחרונה איננה במקומה. אפשר לומר אותו הדבר על wxWidgets)

כתיבת תגובה

האימייל לא יוצג באתר. שדות החובה מסומנים *

Bear