خصائص الخط الحجازي

التصميم الطباعي والخط العربي

بعد أن قمنا بتوضيح الأدوات والمواد المستخدمة في رسم المصاحف الحجازية بقي لنا أن نستعرض خصائص الخط الحجازي كخطوة أخيرة في سلسلتنا عن الخط الحجازي. وسيجد بعض القراء ثقلاً في هذه المقالة لما تحويه من الخصائص الفنية التي لا تروق في الغالب إلا للمتخصصين فأرجو المعذرة ممن ليس لهم فضول في معرفة تفاصيل قد عفى عنها الدهر وأصبحت شيئاً من الماضي.

ولقد أمضيت عدداً من الأشهر خلال هذه السنة في دراسة الخط الحجازي وتعلمت بعض الحقائق اللطيفة عنه. وبالرغم من أهمية هذا الخط فيما يتعلق بجذور وأصل الخط العربي فإن المعلومات المتوفرة عنه قليلة (وخاصة بالعربية) والإهتمام به قليل (وخاصة عند العرب).  ولا أدّل من ذلك إلا هذا الفلم الوثائقي الذي ظهر على قناة الجزيرة الوثائقية منذ فترة وهو مليء بالأخطاء التاريخية والفنية فيما يتعلق بالحرف الحجازي.

وظاهرة قلة المعرفة بالخط الحجازي لها أسباب، نذكر منها صعوبة قراءة النص لغرابة شكل الحروف في نصوص المخطوطات الحجازية عمّا يعرفه…

View original post 1,838 more words

2010 Calendar done with the Complex Grid

Whatype

2010calendar

This is the Whatype 2010 Calendar. I’ve done using the Complex Grid. It’s almost an year since I’ve posted the article for this kind of grid and it has had a lot of views. I thought that making something using this grid and explaining the details could be fun and useful.

One of the advantages of making a grid with the care that takes to make a complex grid is that after all the work is done it’s really easy to make everything fit perfectly and our design almost ‘creates itself’. Since the Complex Grid divides the page in 2‘s, 3‘ , 4‘ and 6‘s; I had to use the 6 division to place two months. On this grid I’ve made there are 11 lines for each division of 6

Picture 4

So each month will take 4 lines and there will still be 3 lines left…

View original post 358 more words

‘GRID’ in Arial, Helvetica and Impact

TOOLE


Setting the word ‘GRID’ in three different sans-serif typefaces (Arial, Helvetica and Impact,) I marked all the vertical and horizontal lines I could see that construct the letter. I found it was a good way to compare the structure of the typefaces and the visual image it creates is quite striking.

An ambitious project could be to create some sort of coding system using this idea and a selected typeface. Perhaps if each letter had a black box around it and someone spent a lot of time memorising the visual image each letter forms, it would be possible to send secret messages..?

View original post

Well Designed – Braun – Dieter Rams

Chairman of the Board

Dieter Rams – Lead Braun designer from 1961 – 1995. Here we shall look at Mr. Rams ten principles of design and a few of my favourite Braun products.  Thank you Mr. Rams

Is innovative – The possibilities for innovation are not, by any means, exhausted. Technological development is always offering new opportunities for innovative design. But innovative design always develops in tandem with innovative technology, and can never be an end in itself.

Makes a product useful – A product is bought to be used. It has to satisfy certain criteria, not only functional, but also psychological and aesthetic. Good design emphasizes the usefulness of a product whilst disregarding anything that could possibly detract from it.

Is aesthetic – The aesthetic quality of a product is integral to its usefulness because products are used every day and have an effect on people and their well-being. Only well-executed objects can…

View original post 217 more words

Working with Guides in Inkscape

inkscape tutorials blog

Guides (or Ruler Guides) are lines that can be placed on the document, useful for lining up and snapping elements. Guides can be a little non-discoverable in inkscape, so this article gives you a few quick tips to get the most out of guides in inkscape.

1. Quickly creating a guide

A guide can be quickly created by clicking on either the vertical or horizontal ruler, and dragging onto the canvas. If you drag from close to where the corners meet, an angled guide will be created:dragging-guides

2. Converting a path to Guides

Any object or path can be converted to guides Using Objects > Objects to guides (or keyboard shortcut Shift + G)

convert-path-to-guides

3. Deleting a guide

To Delete a guide, hover the mouse cursor over the guide, and press the Delete key on the keyboard.

deleteguide

4. Rotating a guide

To rotate a guide, hover over it with…

View original post 175 more words

A compound grid based on Gerstner’s Capital Magazine

Source

The Gerstner

6 column + 4 column overlaid at the same breakpoint

Introduction

This layout is designed using a recreation of Karl Gerstner’s compound grid that was designed for Capital Magazine in the 1960’s. It’s a compound – meaning combined – grid of 6 column and 4 columns. This allows for very flexible layout combinations, including the unusual 5 column, asymmetric column configuration which is the basis for this layout.

This layout is designed using a recreation of Karl Gerstner’s compound grid that was designed for Capital Magazine in the 1960’s. It’s a compound – meaning combined – grid of 6 column and 4 columns. This allows for very flexible layout combinations, including the unusual 5 column, asymmetric column configuration which is the basis for this layout.

This layout is designed using a recreation of Karl Gerstner’s compound grid that was designed for Capital Magazine in the 1960’s. It’s a compound – meaning combined – grid of 6 column and 4 columns. This allows for very flexible layout combinations, including the unusual 5 column, asymmetric column configuration which is the basis for this layout.

This layout is designed using a recreation of Karl Gerstner’s compound grid that was designed for Capital Magazine in the 1960’s. It’s a compound – meaning combined – grid of 6 column and 4 columns. This allows for very flexible layout combinations, including the unusual 5 column, asymmetric column configuration which is the basis for this layout.It’s a compound – meaning combined – grid of 6 column and 4 columns. This allows for very flexible layout combinations, including the unusual 5 column, asymmetric column configuration which is the basis for this layout.

This layout is designed using a recreation of Karl Gerstner’s compound grid that was designed for Capital Magazine in the 1960’s. It’s a compound – meaning combined – grid of 6 column and 4 columns. This allows for very flexible layout combinations, including the unusual 5 column, asymmetric column configuration which is the basis for this layout.

This layout is designed using a recreation of Karl Gerstner’s compound grid that was designed for Capital Magazine in the 1960’s. It’s a compound – meaning combined – grid of 6 column and 4 columns. This allows for very flexible layout combinations, including the unusual 5 column, asymmetric column configuration which is the basis for this layout.

This layout is designed using a recreation of Karl Gerstner’s compound grid that was designed for Capital Magazine in the 1960’s. It’s a compound – meaning combined – grid of 6 column and 4 columns. This allows for very flexible layout combinations, including the unusual 5 column, asymmetric column configuration which is the basis for this layout.

Continued

This layout is designed using a recreation of Karl Gerstner’s compound grid that was designed for Capital Magazine in the 1960’s. It’s a compound – meaning combined – grid of 6 column and 4 columns. This allows for very flexible layout combinations, including the unusual 5 column, asymmetric column configuration which is the basis for this layout.

This layout is designed using a recreation of Karl Gerstner’s compound grid that was designed for Capital Magazine in the 1960’s. It’s a compound – meaning combined – grid of 6 column and 4 columns. This allows for very flexible layout combinations, including the unusual 5 column, asymmetric column configuration which is the basis for this layout.

  Columnheading Column heading Column heading Column heading Column heading
Row heading Row data Row data Row data Row data Row data
Row heading Row data Row data Row data Row data Row data
Row heading Row data Row data Row data Row data Row data

How to create animated GIFs for UI design presentations: Part 1

Design and conquer

Weather app animated GIF Weather app animated GIF

tutorialmediumYou may have seen really cool animated GIFs that design professionals are using to present UI design on Behance, Dribble and other design communities platforms and wondered how did they created them. What is fast becoming one of the best ways of illustrating gestures and animations in mobile apps, animated GIFs offer a little more over traditional storyboards and static screenshots. In Part 1 of the series, I show how to create the animated GIF above. The second part will explain how to export your files properly and optimize into a GIF. Download of project file is also available. The third and final tutorial breaks down the transitions and animations more fully.

View original post 568 more words