>> Web Development Process & Technologies

Web-based Systems | Misbhauddin MEET PLAN THE PROCESS DESIGN DEPLOY PROGRAM Web-based Systems | Misbhauddin

Web-based Systems | Misbhauddin The Process Wireframe Content Functional Code Planning Concept Design Development Launch Site Map Functional Specs Design Layout Web-based Systems | Misbhauddin

Consult & Plan 1 2 3 4 PHAS E 1 Gather Clients Requirements WHAT Interview, Questionnaires HOW extended development time, cost overruns & missed deadlines WHY PHAS E 1 Needs Assessment Site Outline 1 2 3 4 Initial Meeting Research Profile Customers, Analyze Business WHAT Competitor Analysis Best Practices HOW Targeted Development WHY Web-based Systems | Misbhauddin

Concept 6 5 PHAS E 2 WHAT HOW WHY Create a flat concept design Simplified sketch of the important information in a page Get Client Feedback PHAS E 2 Wireframe 6 5 Content Outline RSS Feeds Blogs Survey E-commerce WHAT HOW WHY Advertising Discussion Forum Define each type of content Relate contents Writing Skills Target Audience Call to Action Enhance the appeal and usefulness of the website Search Links Forms Image Gallery Social Media Web-based Systems | Misbhauddin

Web-based Systems | Misbhauddin Design Color Schemes Vector Editing Software PHAS E 3 Inner Page(s) Artwork 7 8 Landing Page Artwork Royalty-Free Images Icons Web-based Systems | Misbhauddin

Cross-Browser & Device Testing Development {Placeholders} Content Population Coding PHAS E 4 12 11 10 9 Cross-Browser & Device Testing Validation Responsive Web Design Web-based Systems | Misbhauddin

Web-based Systems | Misbhauddin Launch Search Engine Submission Sitemaps Social Media Buzz Link Advertisements PHAS E 5 SEO 13 14 15 Refinement Launch Pre-Launch Checklist Clean Design Clean Code Proof-read Web Hosting FTP Server-Platform Server-Type Free Shared Dedicated Web-based Systems | Misbhauddin

Web-based Systems | Misbhauddin Technology Framework Web Systems Static Dynamic Client-Side Server Side Web-based Systems | Misbhauddin

Server-Side Web Development Languages General-purpose language designed for web development to produce dynamic web pages Ruby is an OOPL designed to make programming fun and flexible Python is a high level language designed to emphasize productivity and code readability ASP .Net is a web application framework that allows development of dynamic websites, web apps and web services Web-based Systems | Misbhauddin

Web-based Systems | Misbhauddin Wireframing Web-based Systems | Misbhauddin

Web-based Systems | Misbhauddin Wireframe a.k.a Page Architecture, Page Schematic, or Blueprint {def.} Highly simplified sketch of the important information in a page  {goal} Reflect importance of different elements, including the content and the navigation on the page Web-based Systems | Misbhauddin

Web-based Systems | Misbhauddin Types of Wireframes Wireframes Low-Fidelity High-Fidelity rough sketch or a quick mock-up less detail quick to produce Detail matches actual webpage Takes longer to create Used in documentation Web-based Systems | Misbhauddin

Wireframing Techniques/Tools UI Kits / Stencils Online Tools Offline Difficulty in Collaboration Time Consuming Pen & Paper Specific Diagramming Desktop Application Built online right in the browser Easy to Collaborate Faster Adobe Illustrator AI, Vector EPS Adobe Photoshop PSD Web-based Systems | Misbhauddin

Wireframing Techniques/Tools UI Kits / Stencils http://www.pixeden.com/web-wireframing/webpage-wireframe-stencil http://rafaltomal.com/free-photoshop-wireframe-kit/ http://www.eleqtriq.com/2010/08/sqetch-wireframe-toolkit/ Web-based Systems | Misbhauddin

Wireframing Techniques/Tools Online Tools >> Specific 1 project with 10 pages; 2 users; no archived projects Free/Paid Free/Paid 1 project; 1GB space; 2 users Paid $9/mo; 10 projects; 1GB space Free/Premium Single page 30-Day Free Trial Free for Students (Invited by Instructor Paid Free Web-based Systems | Misbhauddin

Wireframing Techniques/Tools Online Tools >> Diagramming 1 folder with 25 sheets; 15 users; Free/Paid Free/Paid 5 diagrams; 2mb space; 0 users Free/Paid 60 objects/diagrams; 25mb space; 1 users Web-based Systems | Misbhauddin

Wireframing Techniques/Tools Offline Tools >> Desktop Applications FlairBuilder Paid $99; 15-Day Free Trial OmniGraffle Paid $49.99; Mac & iPad; Adobe Fireworks Paid £282.9; 30-Day Free Trial Paid $599.95-$999; 60-Day Free Trial PowerMockup Paid Powepoint Plugin; Trail Version Available Web-based Systems | Misbhauddin

Web-based Systems | Misbhauddin Sample -1 Web-based Systems | Misbhauddin

Web-based Systems | Misbhauddin Sample -2 Web-based Systems | Misbhauddin