בנו תבנית חשבונית משלכם: מדריך מעשי לעורך החזותי

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

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

קודם כול, בכנות: האם אתם באמת זקוקים לתבנית מותאמת?

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

פנו לתבנית מובנית כאשר:

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

בנו תבנית מותאמת אישית כאשר:

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

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

איך העורך חושב: מקטעי רשת-משבצות

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

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

המקטעים שאיתם אתם מרכיבים ממופים ישירות לחלקי החשבונית שכל נמען כבר מבין:

כותרת

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

בלוק השולח

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

בלוק הלקוח

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

טבלת השורות

המהות: תיאור, כמות, מחיר וסכום לכל שורה. כאן הולך רוב המרחב האנכי, וכאן משמעת הפריסה חשובה ביותר. המס יכול להיות כלול או נפרד, ניתן להחיל מספר שיעורים, והטבלה מחשבת עבורכם את הסכום נטו-ממס ואת הסכום לתשלום.

בלוק הסיכומים

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

כותרת תחתונה

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

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

דריסה לפי חשבונית ושיתוף בין פרופילים

שני מאפייני היקף הופכים את העורך לשימושי באמת ולא רק לקישוטי.

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

היקף פרופיל. ‏InvoiceFlow תומכת במספר פרופילים עסקיים באפליקציה אחת, כך שתוכלו לנהל כמה מותגים בלי לתמרן בין כניסות. תבנית מותאמת אישית יכולה להיות משותפת בין פרופילים — שימושי כששני מותגים חולקים זהות-אם ואתם רוצים מערכת מסמכים אחת — או להישמר ייחודית לפרופיל, כך שלכל מותג מראה מכוון משלו. אתם בוחרים לכל תבנית. סטודיו עם מותג ראשי ומיזם צדדי עשוי לשמור עליהם נבדלים ויזואלית; חברת ייעוץ שמנהלת שתי ישויות אזוריות עשויה לשתף תבנית אחת ורק להחליף את הלוגו והפרטים.

מיתוג: מערכת שני הלוגואים

תבנית היא שלד; המיתוג הוא מה שהופך אותה לשלכם. ‏InvoiceFlow משתמשת במערכת שני לוגואים: אתם מאחסנים לוגו ריבועי ולוגו רחב בנפרד, והתבניות ממקמות את הנכון אוטומטית בהתאם למקום שבו הוא נחוץ. סמל ריבועי מתאים לפינה קומפקטית; חיבור רחב מתאים לרצועת כותרת ברוחב מלא. בלי שני הווריאנטים, אתם מסיימים עם לוגו רחב שנדחס לתוך משבצת ריבועית או סמל ריבועי שתקוע בים של רווח לבן בכותרת — שניהם נקראים כ"נעשה בחיפזון".

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

גופנים: החלק שאף אחד לא חושב עליו עד שהוא נשבר

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

ראשית, ייצוג נכון במערכות כתב שאינן לטיניות. גופן שאין בו תווי קירילית, ערבית או CJK אינו נכשל בקול רם — הוא מחליף בשקט בריבועים, סימני שאלה או חזות חלופית שאינה תואמת. ‏NotoSans תוכנן בדיוק כדי להימנע מכך; הוא נושא את כיסוי התווים כך ששם של לקוח רוסי, כתובת בערבית או תיאור שורה בסינית מוצגים כטקסט, לא כ"טופו". אם אתם מחייבים על פני מערכות כתב שונות, זה לבדו שווה לעצב סביבו.

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

הרכבת התבנית המותאמת הראשונה שלכם, לפי הסדר

הנה הרצף שמייצר תבנית שמישה הכי מהר, עם הכי פחות תיקונים.

1. התחילו מהתבנית המובנית הקרובה ביותר, מבחינה מנטלית

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

2. נעלו את הכותרת

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

3. מקמו את בלוקי השולח והלקוח

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

4. עצבו את טבלת השורות עבור המקרה הגרוע ביותר

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

5. הפכו את הסכום הכולל לבלתי אפשרי להחמצה

עוד על כך בהמשך, אבל התייחסו לזה כשלב עיצובי, לא כמחשבה שלאחר מעשה.

6. כתבו את הכותרת התחתונה פעם אחת, כמו שצריך

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

7. בדקו, ואז בדקו בינלאומית

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

עקרונות עיצוב שחשובים יותר מהכלי

הפכו את הסכום הכולל לבולט

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

התאימו לציפיות הנמען

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

הפחיתו לפני שאתם מוסיפים

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

עקביות בכל משפחת המסמכים

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

השורה התחתונה הכנה

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