Craig Webb Art, Advertising and Graphic Design
(917) 797·0983

For help with Information Architecture
email Craig Webb


your message is important

Internet Communications Services
Information Architecture, Content Development & Front-End Design


Thank you for taking time to review my capabilities. Please contact Craig Webb if you require any additional information or wish to submit a request for work. I look forward to an opportunity to assist you with your business communications development.


UX/IA skills and services

Heuristic evaluations, User testing, Wireframe creation, and Prototyping (Expert hand-coding HTML; Basic knowledge of JavaScript and PHP)


Heuristic Evaluations

User Testing

Wireframe Creation

Live Prototyping

Specification Documentation

Common-sense strategies and techniques to solve problems based on research and previous experience to find satisfactory usability solutions.

Informal testing, interviews and analytics

Simple or complex wireframes in Photoshop or Illustrator

Expert hand-coding HTML; Basic knowledge of JavaScript and PHP

Clearly written project descriptions for clients and developers


Information Architecture – Wireframe Prototyping

– Wireframes to explain page strategy or to gain client approval for a new project can be very simple or complicated depending on the focus of the negotiation and the strategic objective. Wireframes are made in either Adobe Photoshop or Illustrator.

– When discussions are about specifying deliverables, such as functions and content objectives, design and style is purposefully avoided to keep focus on the content.

– Complex wireframes are created to explain design and usability to developers or as-needed by the client.

– Often a sketch can go directly to live prototype for review. However, creating a “rough” in Illustrator to workout ideas is sometimes worthwhile to save time and explore ideas.

– I write detailed technical specifications to define scope or explain the need and use for a dynamic element. I am able to convey intentions clearly to developers as well as in simple terms for the client.

– Technical specifications for developers require context as well as clear detail to ensure that the developer does not have to extrapolate meaning.



Examples of wireframe planning documents:


Icarus Group Ironwork

Simple document used for project discussion and sales tool. No design representation.

Icarus Group Ironwork.pdf
http://db.tt/LrOTPoA



Thomas Publishing

Multi-layer PSD and Illustrator comps produced for Marketing Department / .NET Developers

Beta-Manufacturing-Executive02.jpg
http://db.tt/43GOg6A


Manufacturing-Executive-Mockup04.jpg
http://db.tt/R8HDVsD


Manufacturing-Executive-Mockup05a.jpg
http://db.tt/lKrrR1G



Jung Designs

One of many prototypes built in RapidWeaver and converted into a JPG for a mid-project client discussion about choosing style.

JungDesigns_Comp02.jpg
http://db.tt/UA3Heqp



Shalizar Properties

Comp II

The purpose of these wireframes was to nail down client requirements for interface deliverables at start of project while limiting discussion about style.

Shalizar Properties/Comp II Home-About_Page.jpg
http://db.tt/LQjXWPu


Shalizar Properties/Comp II Project_Page.jpg
http://db.tt/Zv2iXVB


Shalizar Properties/Comp II Project_pg_Pop-up.jpg
http://db.tt/4Xqu0Jl


Shalizar Properties/Comp II Contact_MAIN_Page.jpg
http://db.tt/BWPlD8p


Comp III

Working prototypes turned into JPGs and modified in Photoshop to work out details of style and content layout with client, mid-project.

Shalizar Properties/Comp III Shalizar_Project_Pg.jpg
http://db.tt/cjRyCWw


Shalizar Properties/Comp III Shalizar_Latifa_Pg_v1.jpg
http://db.tt/TDXF4G3


Shalizar Properties/Comp III Shalizar_Latifa_Pg_v2.jpg
http://db.tt/TGvmXtT



Randall’s Auto Body

The purpose of these wireframes was to nail down client requirements for interface deliverables and to discuss what written content was needed, while limiting discussion about style.

Randall’s Website Comp Version03 Home Page.jpg
http://db.tt/Nl7ZwIm


Randall’s Website Comp Version03 Repair Services.jpg
http://db.tt/OFCY5Dq


Randall’s Website Comp Version03 Photo Gallery_06.jpg
http://db.tt/epcUByO


Randall’s Website Comp Version03 Contact Randall’s.jpg
http://db.tt/QlCeV6i



Bill Miller Photography

An early comp made in Adobe Illustrator to show ideas for page layout to the client, and a screenshot of a working prototype made at a further stage of development.

BM_photoWebCompA01.jpg
http://db.tt/QVlrgyS


BMwebsiteComp5.jpg
http://db.tt/cXwdDt7



Windowman

Comp made in Adobe Illustrator as a sales tool.

WM_mockup-pg4.jpg
http://db.tt/xDVfuYc



ATC Website

Site Map.

ATC Web Flow Chart.jpg
http://db.tt/fST3g94



Site maps:

http://www.randallsautobodyny.com/randallsautobodyny_sitemap.htm

http://icarusgroupironwork.com/icarus-group_sitemap.htm



Craig Webb Art – Showcase of Recent Websites


IcarusGroupIronwork.com
Ornamental Ironwork, Steel Fabrication and Welding Services

Icarus Group Ironwork website: http://www.IcarusGroupIronwork.com

Website Development Role:

– Art Direction and Project Management

– Website Architecture and Design

– Copy Writing: Researched client products and services, wrote entire website copy including cut-lines and alt tags

– Hand-coded Valid HTML5/CSS3

– Includes JavaScript / JQuery / PHP



KosherWineSociety.com
Private Organization, Social Events – Israel Wine Tour

Israel Wine Tour website: http://kosherwinesociety.com/WineTrip/

Website Development Role:

– Art Direction and Project Management

– Website Architecture and Design

– Copy writing

– Hand-coded Valid HTML5/CSS3 design

– Acquired Photo Art, including permissions, to populate the website



ShalizarProperties.com
Real Estate Development

Shalizar Properties website: http://www.ShalizarProperties.com/

Website Development Role:

– Art Direction and Project Management

– Website Architecture and Design

– Copy writing

– Hand-coded Valid HTML5/CSS3 design

– PHP Form and formatting



RandallsAutobodyNY.com
Restoration of Classic and Hi-end Automobiles

Randall’s Auto Body website: http://www.randallsautobodyny.com/

Website Development Role:

– Art Direction and Project Management

– Website Architecture and Design

– Copy writing: Researched client products and services, wrote entire website copy including cut-lines and alt tags

– Valid XHTML/CSS design

– PHP Form and formatting

– Social Media and Internet Marketing



MollerElectricInc.com
Electrical Wiring and Repair Service

Moller Electric Inc. website: http://www.craigwebbart.com/electric/

Website Development Role:

– Art Direction and Project Management

– Converted to pre-existing website to current XHTML format, Re-designed Website menu and content areas, added contact forms and other elements

– Copy writing: Researched client products and services, wrote entire website copy including cut-lines and alt tags

– Valid XHTML/CSS design

– PHP Form and formatting

– Social Media and Internet Marketing



JungDesigns.net
Interior Design for the Hospitality Industry

Jung Designs website: http://www.JungDesigns.net/

Website Development Role:

– Website Design using RapidWeaver CMS



JDMInsurance.com
Independent Insurance Agent

James D. Miller Insurance website: http://www.jdminsurance.com/

Website Development Role:

– Art Direction and Project Management

– Website Architecture and Design

– Copy writing: Researched client products and services, wrote entire website copy including cut-lines and alt tags

– Valid XHTML/CSS design

– PHP Form



BillMillerPhotography.com
Real Estate Photography

Bill Miller Photography: http://www.billmillerphotography.com/

Website Development Role:

– Art Direction and Project Management

– Market Research

– Website Architecture and Design

– Content Management

– Website Architecture and Design

– Copy writing: Researched client products and services, wrote entire website copy including cut-lines and alt tags

– Valid XHTML/CSS/JavaScript design

– PHP Form



RisaClayArt.com
Ceramic Artist

Risa Clay Art: http://www.risaclayart.com/

Website Development Role:

– Art Direction and Project Management

– Website Architecture and Design

– Valid XHTML/CSS design

– PHP Form


Craig Webb Art – Other Clients


Mirren
New Business Training

Mirren’s website: http://www.mirren.org/

E-mail Development Role:

– Art Direction and Design

– Photoshop Design

– HTML for Email



Square Feet Inc.
Real Estate Development

Square Feet’s website: http://www.squarefeet.com/

E-mail Development Role:

– Art Direction and Design

– Photoshop Design

– HTML for Email



Integrated social media strategies


IcarusGroupIronwork.com

– I added links to Icarus external Social Media, including Facebook, Twitter, YouTube, and Flickr. I added Twitter Widget into Links Page. I am adding a Google+ button.

– Icarus Group’s website ranks on first page of Google for “iron work new york”

– Icarus Group’s social media is geared towards increasing SEO.


KosherWineSociety.com

– I acquired photography from Flickr.com to accompany text. I contacted the photographers to gain permission for use. I added credits with links where possible.


RandallsAutobodyNY.com

– I created Facebook and Twitter accounts for my client.

– I maintained the Twitter account. I wrote tweets, followed industry twitteratti and gained followers. I re-tweeted local businesses to gain brand loyalty.

– I re-purposed website copy into ads for craigslist.org. I posted ads on a regular basis to gain recognition on Google.

– Randall’s website ranks on second page of Google for “waxoyl”, and on first page top of Google for “waxoyl new york”


The importance of Content, UX and SEO:

– Websites that work without users needing to think build brand trust and gain results.

– UX and SEO are complimentary. Getting a consumer to your website first is critical. Once the user arrives on the website they become the most important focus.

– I assert that the copy that I write is the most important service that I provide. I research competitors to learn what services are typically offered and to build a library of searchable terms and phrases. I edit those product and service terms into concise copy. I re-edit the copy to compress the text as much as possible. Finally, I edit live on the web page for fit. Most importantly, I read the copy aloud to ensure that it sounds conversational.

– I concentrate primarily on the written content and presentation within the website. Searchable terms and phrases are incorporated into the text while striving for a natural tone or voice. The text should sound natural when read aloud. Keyword phrases are worked into section headlines. I incorporate search-content into cut-lines, alt tags, link titles and meta tags, making sure that terms are not repeated.

– Good content is recognized and highly ranked by Google, and is therefore both UX and SEO.

– Using HTML5, semantic elements are available to contribute to UX/SEO and accessibility.

– Much of the services content for Randall’s Auto Body appears on the Repair & Services Page. The content was later separated into individual pages and listed in the second tier of the top menu. We did it to make content easy to see and access through the menu, for users. The result is that important service pages appear on page One or Two, on Google.

– The Icarus website Product Page currently has six articles with planning for three more. I would have separated this content onto individual pages, except that the quantity of pages is limited by the project scope. That said, the HTML5 semantic structure clearly defines each article individually so that Google can recognize each article and evaluate it’s content value. It is also easy for clients to browse and see all of the services on one page. Additional navigational aids were created to direct users and Google.


Magento, Drupal, Wordpress and custom CMS:

– I built JungDesigns.net, http://www.JungDesigns.net/ using RapidWeaver, a CMS-like stand-alone program

– Using Microsoft’s OfficeLive, I built a website for Helping Hands for the Disabled of NYC, a Non-profit Service Organization. The website no longer exists. The current website (not mine) is HHDNYC.org

– I fixed the PHP, including a MySQL database, for a website baltimoreschoolofdoggrooming.com. The old PHP lacked POST tags so that when the website host updated their system the website no longer worked.

– My own Wordpress page. I’ve edited the format, updated the version of Wordpress, and successfully screened the blog for SPAM mal-ware.

– I experimented with Joomla! while building a prototype for the Kosher Wine Society. I have downloaded Drupal and Magento to explore. I build "modules" using PHP for websites, such as Randall’s and Icarus, that are added to the page as "includes".


Client Relationships:

– I’ve worked in many agency and corporate settings including many that are not listed on my resume. I keep client relationships confidential as needed.

– I listen to my clients to learn about their business needs and suggest a website structure that supports their business objectives. I am familiar with the pitfalls that can occur when objectives are not clearly defined. I work hard to avoid them.

– I look forward to an opportunity to provide delightful communications design for you. Please contact me via my website or by calling (917) 797-0983 now.





&bnsp;