UI פיגמה, שתי שאלות: 1. ייצוא, 2.יחידות מידה

[א-ירושלמית]

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

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

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



@סיון, חסר לי מקדם ושמו "פיגמה". אשמח שתוסיפי.

 

[חיוך]

אם קיים בפיגמה - אמור להיות בלינק המשותף למשפתחים.
אם לא - יש מגוון כלים אחרים, כמו אבוקוד, זפלין וכדו'.
וכן המפתחים יכולים לחשב את המידות בעצמם במחשבון ייעודי, תחפשי בגוגל PX TO REM.

 

[Tamar G]

rem זאת יחידת מידה של אחוזים לפי וידג'ט האב.
לדוגמא כפתור הקיים בתוך אזור פנימי אם אני אגדיר לכפתור 20% הוא יהיה תמיד חמישית מהמסך,
אם אני אגדיר לו 20rem הוא יהיה 20% מתוך האזור הפנימי, כך שלא ייווצר מצב בו הוא יצא מהאזור.
לעניות דעתי לא ניתן להגדיר זאת בפיגמה.
אך החשבון הוא פשוט אם קיים לך רכיב כלשהו באפיון שהוא ברוחב 270px והמסך ברוחב 1080px
270/1080 = 4
ממילא הכפתור באחוזים 25% מגודל המסך,
כנ"ל החישוב לגבי רכיב בתוך רכיב נוסף.

 

[חיוך]

rem זאת יחידת מידה של אחוזים לפי וידג'ט האב.
לדוגמא כפתור הקיים בתוך אזור פנימי אם אני אגדיר לכפתור 20% הוא יהיה תמיד חמישית מהמסך,
אם אני אגדיר לו 20rem הוא יהיה 20% מתוך האזור הפנימי, כך שלא ייווצר מצב בו הוא יצא מהאזור.
לעניות דעתי לא ניתן להגדיר זאת בפיגמה.
אך החשבון הוא פשוט אם קיים לך רכיב כלשהו באפיון שהוא ברוחב 270px והמסך ברוחב 1080px
270/1080 = 4
ממילא הכפתור באחוזים 25% מגודל המסך,
כנ"ל החישוב לגבי רכיב בתוך רכיב נוסף.

רק תשאלי את המפתחים אם הם מוכנים לעבוד כך

ואגב, זו מכפלה של גודל פונט שמוגדר ל- HTML,
ולא מקביל לאחוזים בכלל.

מאמר בעברית שמסביר סוגי יחידות מידה:

המדריך המלא ליחידות מידה רספונסיביות ב-CSS

מדריך שיעשה לכם סדר בנוגע ליחידות מידה רספונסיביות ב-CSS. מהו rem? במה הוא שונה מ-em? מתי נשתמש ב-vw ועוד.

www.codebrain.co.il

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

 

[א-ירושלמית]

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

ועדיין השאלה השניה - איך מייצאים? צעד אחרי צעד...