To do things fast and in the min. number of steps..

1. Agility
in Web Design & Development
Ahmed AlShair

2. What is Agility?
• To do things fast and in the min. number of steps.
• Wide capability to edit or re-shape your work easily.

3. Why Agility?
• Because TIME is the largest
obstacle in web design and
development tasks!

4. Agility in
Pre-Design Stage
Assets Design Stage
Coding Stage
+ A nice Trick for Web Pages Transition

5. Pre-Design Stage
• Think First !
• Use Your Pen..
• Choose the Right
WorkSpace

6. Design Stage
• Use The Right Tools !
Photoshop:
• Generator
• Automate-Batch

7. Generator Syntax
200x500 Image_name.png -92%
35cmx70cm Image_name.jpg 80%
60% folder/Image.png
150% img1.gif,img2.jpg
Size Name Quality
125mmx? img1.gif,img2.jpg

8. Coding Stage
• Choose the Right Code Editor!
Fast
Review
on
Brackets

9. Coding Stage
• Create your own
Frameworks and
Libraries
• Consider Easy
maintenance while
coding

10. Page Transitions
• How to make web
pages transition
elegant and
unique?

11. Thank You
Feel Free to Ask !