derrick douglass web design, web development and graphic design douglass...

27
Design + Innovate + Create transforms Products that whisper into brands that shout! Design | PORTFOLIO

Upload: derrick-douglass

Post on 06-Aug-2015

64 views

Category:

Documents


1 download

TRANSCRIPT

Page 1: Derrick Douglass web design, web development and graphic design  douglass design_and_development_portfolio_2015

Design + Innovate + Create

transforms Products that whisper

into brands that shout!

Design|PORTFOLIO

Page 2: Derrick Douglass web design, web development and graphic design  douglass design_and_development_portfolio_2015

Design + Innovate + CreateDesign + Innovate + Create

I look forward to discussing and learning about HOW I CAN DESIGN USER EXPERIENCES THAT ADDimmediate value to your customers and organization,AND EXTEND ACROSS WEB, MOBILE, SOCIAL AND OTHER MEDIUMS

Derrick Douglass, MBA

Page 3: Derrick Douglass web design, web development and graphic design  douglass design_and_development_portfolio_2015

Design + Innovate + Create

AboutMe

Infuses creativity, passion and drive into designing and developing user experiences, that achieve real-world business goals.

Designs and develops websites and graphics that transform products that whisper into brands that SHOUT!

Additionally, leverages extensive technology and marketing expertise to complete multiple projects ahead of schedule and under budget.

Seeks fun, collaborative and creative environments.

FavoriteQuote

Design is a plan for arranging elements in such a way as best to accomplish a particular purpose-- Charles Eames

Design + Innovate + Create

Page 4: Derrick Douglass web design, web development and graphic design  douglass design_and_development_portfolio_2015

Design + Innovate + CreateDesign + Innovate + Create

TAXONOme

PASSIONATE

FUN

AGILEFRESH

INNOVATIVE

Page 5: Derrick Douglass web design, web development and graphic design  douglass design_and_development_portfolio_2015

Design + Innovate + Create

WEBDESIGN

“The ability to simplify means to eliminate the unnecessary so that the necessary may speak.”

- Hans Hofmann

Page 6: Derrick Douglass web design, web development and graphic design  douglass design_and_development_portfolio_2015

Design + Innovate + Create

The wireframe depicts the page layout or arrangement of the website’s content, including interface elements and navigational systems, and how they work together.

This project’s challenge was its need to present enough content chunks without overloading visitors with too much information.

Client: Derrick Douglass Designs URL: www.redtailangels.comRole: Art Director/Designer/DeveloperTools: Adobe Photoshop

DERRICK +DOUGLASS +DESIGNS +

WIREFRAMEDESIGN

3G 4:08 PM

Page 7: Derrick Douglass web design, web development and graphic design  douglass design_and_development_portfolio_2015

Design + Innovate + Create

The concept and wireframes were created by the lead designer.

Transforming the designer’s wireframes into webpages required intuition and strong design skills.

Layout and color selection were chosen carefully to remain in lock-step with the designer’s vision.

Client: American Institutes for ResearchClient: Wallace FoundationRole: Web DesignerTools: Adobe Photoshop

MOCK UP DESIGNfrom WIREFRAME

Page 8: Derrick Douglass web design, web development and graphic design  douglass design_and_development_portfolio_2015

Design + Innovate + Create

Page 9: Derrick Douglass web design, web development and graphic design  douglass design_and_development_portfolio_2015

Design + Innovate + Create

Project: QB-191 | Design Mockup · Client: Principal Professional Development · Project Type: Web Site Enhancement

Creation Date: 06MAY2015 · Created by: Derrick Douglass

Resources

username

password

loginforgot password?

Coaching

Coaching Log

A website must grow as client and customer’s needs change.

It was a challenge to design new website features, while maintaining the existing look and feel.

Applying a deep understanding of the current and aspirational user experience needs to the design process, lead to a successful project.

Client: American Institutes for ResearchClient: Mathematics/SPRRole: Web DesignerTools: Adobe Photoshop & InDesign

DERRICK +DOUGLASS +DESIGNS +

MOCK UP DESIGN

Page 10: Derrick Douglass web design, web development and graphic design  douglass design_and_development_portfolio_2015

Design + Innovate + Create

Project: QB-191 | Design Mockup · Client: Principal Professional Development · Project Type: Web Site Enhancement

Creation Date: 24APR2015 · Created by: Derrick Douglass

Loris ates velecus dolor siti core acearch ilitius volor sit, tet, Quis ma volore pliberferem Fuga. Rae doloritas ute perro Optate volorpor rest idi suntion pos comnihiliqui cusdae Preriosam a quae. Res exped earuntion perae voluptaque Vel iment atecto il eos est Etur reped magni ut as as rem

Summer Institute

Loris ates velecus dolor siti core acearch ilitius volor sit, tet, Quis ma volore pliberferem Fuga. Rae doloritas ute perro Optate volorpor rest idi suntion pos comnihiliqui cusdae Preriosam a quae. Res exped earuntion perae voluptaque Vel iment atecto il eos est Etur reped magni ut as as rem

Formal Training

Loris ates velecus dolor siti core acearch ilitius volor sit, tet, Quis ma volore pliberferem Fuga. Rae doloritas ute perro Optate volorpor rest idi suntion pos comnihiliqui cusdae Preriosam a quae. Res exped earuntion perae voluptaque Vel iment atecto il eos est Etur reped magni ut as as rem.

Professional Learning Community (PLC)

Resources

Home Resources

Events Calendar

Olorepelecusa voluptae niminis verumqui int volecerum ne prae vo-A

PR 03

Olorepelecusa voluptae niminis verumqui int volecerum ne prae vo-A

PR 04

Olorepelecusa voluptae niminis verumqui int volecerum ne prae vo-A

PR 10

Olorepelecusa voluptae niminis verumqui int volecerum ne prae vo-A

PR 11

Olorepelecusa voluptae niminis verumqui int volecerum ne prae vo-A

PR 23Olorepelecusa voluptae niminis verumqui int volecerum ne prae vo-A

PR 24

Olorepelecusa voluptae niminis verumqui int volecerum ne prae vo-A

PR 25 Project: QB-191 | Design Mockup · Client: Principal Professional Development · Project Type: Web Site Enhancement

Creation Date: 24APR2015 · Created by: Derrick Douglass

Prework Loris ates velecus dolor siti core

Quis ma volore pliberferem Fuga.

Optate volorpor rest idi suntion

Res exped earuntion perae voluptaque

Day Of Loris ates velecus dolor siti core

Quis ma volore pliberferem Fuga.

Optate volorpor rest idi suntion

Res exped earuntion perae voluptaque

Homework Loris ates velecus dolor siti core

Quis ma volore pliberferem Fuga.

Optate volorpor rest idi suntion

Res exped earuntion perae voluptaque

Resources Loris ates velecus dolor siti core

Quis ma volore pliberferem Fuga.

Optate volorpor rest idi suntion

Res exped earuntion perae voluptaque

Summer Institutes: Overview by Day

Home Resources Summer Institutes

DOWNLOAD

Day 1

Day 2

Day 3

Day 4

Project: QB-191 | Design Mockup · Client: Principal Professional Development · Project Type: Web Site Enhancement

Creation Date: 24APR2015 · Created by: Derrick Douglass

Formal Training

Loris ates velecus dolor siti core

Quis ma volore pliberferem Fuga.

Optate volorpor rest idi suntion

Day 1 Loris ates velecus dolor siti core

Quis ma volore pliberferem Fuga.

Optate volorpor rest idi suntion

Day 2

Loris ates velecus dolor siti core

Quis ma volore pliberferem Fuga.

Optate volorpor rest idi suntion

Day 3 Loris ates velecus dolor siti core

Quis ma volore pliberferem Fuga.

Optate volorpor rest idi suntion

Day 4

Loris ates velecus dolor siti core

Quis ma volore pliberferem Fuga.

Optate volorpor rest idi suntion

Day 5 Loris ates velecus dolor siti core

Quis ma volore pliberferem Fuga.

Optate volorpor rest idi suntion

Day 6

Loris ates velecus dolor siti core

Quis ma volore pliberferem Fuga.

Optate volorpor rest idi suntion

Day 7 Loris ates velecus dolor siti core

Quis ma volore pliberferem Fuga.

Optate volorpor rest idi suntion

Day 8

Home Resources Formal Training

DOWNLOAD

Project: QB-191 | Design Mockup · Client: Principal Professional Development · Project Type: Web Site Enhancement

Creation Date: 24APR2015 · Created by: Derrick Douglass

PLC

Home Resources PLC

Cestorep tatur, omnisciis reium quo et modis magnis ditatecta dundi ut quosApril 1 | 2015

Adobe Connect: www.adobe.com/adobeconnect.html

Call-in information:1-800-503-2899 ; 649659

Materials: Cestorep tatur, omnisciis reium quo et modis magnis ditatecta dundi ut quos

Cestorep tatur, omnisciis reium quo et modis magnis ditatecta dundi ut quosApril 1 | 2015

Adobe Connect: www.adobe.com/adobeconnect.html

Call-in information:1-800-503-2899 ; 649659

Materials: Cestorep tatur, omnisciis reium quo et modis magnis ditatecta dundi ut quos

File: Collaboration Website Guide--04012015.docx

Description: Cestorep tatur, omnisciis reium quo et modis magnis ditatecta dundi ut quos

File: Collaboration Website Guide--04012015.docx

Description: Cestorep tatur, omnisciis reium quo et modis magnis ditatecta dundi ut quos

File: Collaboration Website Guide--04012015.docx

Description: Cestorep tatur, omnisciis reium quo et modis magnis ditatecta dundi ut quos

Description: Cestorep tatur, omnisciis reium quo et modis magnis ditatecta dundi ut quos

File: Collaboration Website Guide--04012015.docx

Description: Cestorep tatur, omnisciis reium quo et modis magnis ditatecta dundi ut quos

File: Collaboration Website Guide--04012015.docx

Description: Cestorep tatur, omnisciis reium quo et modis magnis ditatecta dundi ut quos

File: Collaboration Website Guide--04012015.docx

Description: Cestorep tatur, omnisciis reium quo et modis magnis ditatecta dundi ut quos

Description: Cestorep tatur, omnisciis reium quo et modis magnis ditatecta dundi ut quos

Page 11: Derrick Douglass web design, web development and graphic design  douglass design_and_development_portfolio_2015

Design + Innovate + Create

WEBDEVELOPMENT

“If you think math is hard, try web design.”

― - Trish Parr

Page 12: Derrick Douglass web design, web development and graphic design  douglass design_and_development_portfolio_2015

Design + Innovate + Create

The website’s first incarnation was good, but the client wanted amazing.

Among many site changes, it was transformed from a multi to a single page site.

Additionally, a jQuery plug-in was developed for the project to highlight the menu item corresponding to each section visitors scroll to.

Client: TheGigawattGroup URL: www.gigawattgroup.comRole: Web Developer/Designer Stock Photography: Deviant Art dot Com Tools: Sublime Text II,+Adobe IllustratorLanguages: HTML/CSS & jQuery

DERRICK +DOUGLASS +DESIGNS +

WEB SITEDEVELOPMENT

3G 4:08 PM3G 4:08 PM

Page 13: Derrick Douglass web design, web development and graphic design  douglass design_and_development_portfolio_2015

Design + Innovate + Create

3G 4:08 PM

The client’s design brief stated that the landing page had to be cool, minimum and communicate the Clean Cuts and Cerebral Lounge combined brand.

The resulting landing page is clean and responsive. A Scalable Vector Graphic (SVG) was used so the hyperlinks would scale along with their respective images.

Client: Clean Cuts Cerebral LoungeURL: www.cccl.tvRole: Co-Art Director/Designer/Developer Tools: Sublime Text II, Adobe IllustratorLanguages: HTML5/CSS & JQuery

WEB SITEDEVELOPMENT

CCCL.TV

Page 14: Derrick Douglass web design, web development and graphic design  douglass design_and_development_portfolio_2015

Design + Innovate + Create

Your brand deserves funky, functional and fresh design. To get noticed, your brand can’t whisper, your brand must

SHOUT!

D3’s target audience wants funky, fresh and functional design.

Since they create awesome designs that pump up their customer’s brands, D3 wanted a cool and easy to navigate web site.

Client: Derrick Douglass Designs URL: www.derrickdouglassdesigns.comRole: Art Director/Designer/DeveloperStock Photography: Deviant Art dot Com Tools: Adobe Dreamweaver+IllustratorLanguages: HTML/CSS & JQuery

DERRICK +DOUGLASS +DESIGNS +

WEB SITEDEVELOPMENT

Page 15: Derrick Douglass web design, web development and graphic design  douglass design_and_development_portfolio_2015

Design + Innovate + Create

rED tAIL aNGELS

BIOGRAPHICWEB SITEDEVELOPMENT

The Tuskegee Airmen website is not only informative, but also its look and feel are in keeping with its theme.

The site has an authentic aeronautic look that’s informative and easy to navigate.

Client: Derrick Douglass DesignsURL: www.redtailangels.com Role: Web Developer/Web DesignerStock Photography: U.S. GovtTools: Adobe Dreamweaver + PhotoshopLanguages: HTML/CSS, PHP & jQuery

Page 16: Derrick Douglass web design, web development and graphic design  douglass design_and_development_portfolio_2015

Design + Innovate + Create

M:CRA

MOBILE APPLICATIONDESIGN

M:CRA’s design was inspired by a desire to develop an app from a busy, stressed out sales team's point of view. A tablet app, M:CRA is easy on the eyes, easy to locate files and easy to learn. The apps bold color scheme, intelligent feature placement and exciting graphics has a modern sensibility that looks cool every time it's used.

Client: www.cittrus.com Project: Development ExcerciseRole: Art Director/Designer/DeveloperPhotography: Deviant Art dot Com Tools: Adobe Photoshop/IllustratorLanguages: HTML/CSS

Page 17: Derrick Douglass web design, web development and graphic design  douglass design_and_development_portfolio_2015

Design + Innovate + Create

graphicDESIGN

“There are three responses to a piece of design – yes, no, and WOW!

Wow is the one to aim for.”

- Milton Glaser

Page 18: Derrick Douglass web design, web development and graphic design  douglass design_and_development_portfolio_2015

Design + Innovate + Create

THEATER POSTER | The Piano Lesson

Synetic Theater’s mission is to be the premier American physical theater, fusing dynamic art forms. In keeping with the theater’s mission, the poster was designed with a cubist sensibility, has a strong, striking composition and tells a story.

Client: School Project | Role: Art Director/Graphic Designer | Tools: Adobe Illustrator+Photoshop

SYNETIC THEATERPRESENTED by

AN AUGUST Wilson PLAY

THE PIANO LESSON

dEC.01 - dEC.29.201208:00 pm

1800 S. bELL ST aRLINGTON, va 22202

TIX: www.SYNETICTHEATRE.ORG

Page 19: Derrick Douglass web design, web development and graphic design  douglass design_and_development_portfolio_2015

Design + Innovate + Create

LOGO DESIGN | REDKNOT SYSTEMS

RNS asked us to create a visual identity that consistently communicates the brand across different mediums, connects with the target market and has a unique design.

Client: RedKnot Systems | Role: Art Director/Graphic Designer | Tools: Adobe Illustrator+Photoshop

DESIG

N EXPLO

RATIO

NS

Page 20: Derrick Douglass web design, web development and graphic design  douglass design_and_development_portfolio_2015

Design + Innovate + Create

LOGO DESIGN | REDKNOT SYSTEMS

Initially the client didn’t have a solid idea of what the final logo would look like. Through the discovery process and multiple design modifications, we honed the shape, text, color and layout of the final logo design.

Client: RedKnot Systems | Role: Art Director/Graphic Designer | Tools: Adobe Illustrator+Photoshop

Page 21: Derrick Douglass web design, web development and graphic design  douglass design_and_development_portfolio_2015

Design + Innovate + Create

RESTAURANT BRANDING CAMPAIGN | Advertisement

Avocado Grille’s advertisements were created to be funky, fresh and fashionable. The message connects the target market to the restaurant’s unique tone and brand image.

Client: School Project | Role: Art Director/Graphic Designer | Tools: Adobe Illustrator+Photoshop

FunHealthy

Delicious

Tex-Mex Vegetarian Cuisine

AVOCADOGRILLE

1600 Grant Avenue, Silver Spring, MD 20910 (p) 301.390.0900 (f) 301.390.0901 (u) www.ag.com

Tex-Mex Vegetarian Cuisine

AVOCADOGRILLE

WildFreshDelicious

1600 Grant Avenue, Silver Spring, MD 20910 (p) 301.390.0900 (f) 301.390.0901 (u) www.ag.com

Page 22: Derrick Douglass web design, web development and graphic design  douglass design_and_development_portfolio_2015

Design + Innovate + Create

RESTAURANT BRANDING CAMPAIGN | Layout Design

Menus are a great way to brand the restaurant. The menu’s layout was designed so diners can easily locate and choose their desired dishes.

Client: School Project | Role: Art Director/Graphic Designer | Tools: Adobe Illustrator+Photoshop+InDesign

Nex-Mex Vegetarian Cuisine

AVOCADOGRILLE Livin Livida Fresh

Copyright © 2012 Avocado Grill Enterprises LLC

Sun - Thu: 11:00 am - 10:00 pmFri - Sat: 11:00 am - 11:00 pm

HOURS

LOCATION1600 Grant AvenueSilver Spring, MD 20910(p) 301.390.0900(f) 301.390.0910(em) [email protected](u) www.ag.com

Fresh & Delicious Gourmet Sauces, Salads and Sweets

HOT DRINKSBrewed Coffee s $00 m $00 l $00

Caffé Americano s $00 m $00 l $00

Cappuccino s $00 m $00 l $00

Espresso s $00 m $00 l $00

Caffé Latte s $00 m $00 l $00

Caffé Mocha s $00 m $00 l $00

Chai Tea Latte s $00 m $00 l $00

COLD DRINKSIced Coffee s $00 m $00 l $00

Iced Tea s $00 m $00 l $00

Fruit Juices s $00 m $00 l $00

Sparkling Water s $00 m $00 l $00

Flavored with

cinnamon, chocolate

and vanilla, Mexican

Coffee is an

absolute treat! Serve

with whipped cream

sprinkled with

cinnamon

SALADS

La Paz SaladBed of fresh greens, bean corn salsa, carrots and pico de gallo and topped with crispy tortilla strips.

Southwest Salad Bed of fresh greens with crispy bacon, black bean corn salsa,tomatoes and carrots topped with crispy tortilla strips.

Taco Salad Bed of fresh greens with homemade guacamole, black beancorn salsa, carrots, sour cream, shredded jack and cheddar cheese

Cantina Salad Bed of fresh greens with crispy bacon, black bean corn salsa, onions and peppers, carrots and shredded jack

Cabo Cobb Salad Bed of fresh greens with crispy bacon, black bean corn salsa and pico de gallo topped with crispy tortilla strips.

Frida Khalo Salad Bed of fresh greens with crispy bacon, black bean corn salsa, onions and peppers, carrots and shredded jack

Tiempo Salad Bed of fresh greens with crispy bacon, black bean corn salsa, onions and peppers, carrots and shredded jack

La Fresh Salad Bed of fresh greens with crispy bacon, black bean corn salsa, onions and peppers, carrots and shredded jack

$00

$00

.

$00

$00

$00

.

$00

$00

$00

The avocado (Persea

americana) is a tree

native to Central

Mexico,.

ENTREES

Camarones BrochetteTofu sauteed with monterey jack cheese and jalapenos wrapped in seweed

Godornisas a la ParillaTofu sauteed with monterey jack cheese and jalapenos wrapped in seweed

Vegetable FajitasTofu sauteed with monterey jack cheese and jalapenos wrapped in seweed

Vegetariana Wisi consequat enim vicis eros vulputate consequat, diam ellam mestant.

Txangurro Tofu sauteed with monterey jack cheese and jalapenos wrapped in seweed

Pato Tofu sauteed with monterey jack cheese and jalapenos wrapped in seweed

$00

$00

$00

$00

$00

$00

PASTERIESLa Scone’

Cinnamon Rolls

Banana Bread

Muffins

$00

$00

$00

$00

$00

$00

$00

$00

$00

$00

$00

$00

Viva Crepe

Cinnamon Bread

Sugar Cookie

Chocolate Cookie

Cakes

Pies

Madeleine

Danish

AVOCADOGRILLETex-Mex Vegetarian Cuisine

Page 23: Derrick Douglass web design, web development and graphic design  douglass design_and_development_portfolio_2015

Design + Innovate + Create

LOGO DESIGN | Help Them Hear

Technology, sound, organic and cool are the cues the new logo had to contain based on our brand research. Shape, color, font and elements were carefully selected and arranged to create a sticky, memorable logo design. Client: HelpThemHear LLC | URL: www.helpthemhear.org | Role: Art Director/Graphic Designer | Tools: Adobe Illustrator+Photoshop

Page 24: Derrick Douglass web design, web development and graphic design  douglass design_and_development_portfolio_2015

Design + Innovate + Create

WEB BANNER DESIGN | Help Them Hear

The web banner is one of the first elements a visitor sees when they visit Help Them Hear’s landing page. An additional design element was added to communicate the logo’s visual cues on their web page.

Client: HelpThemHear LLC | URL: www.helpthemhear.org | Role: Art Director/Graphic Designer | Tools: Adobe Illustrator+Photoshop

Page 25: Derrick Douglass web design, web development and graphic design  douglass design_and_development_portfolio_2015

Design + Innovate + Create

resume

Freyda’s Hands logo design contest winner Phi Theta Kappa Academic Honor Society

HTML5/CSS3JavascriptjTwitter BootstrapExcel (expert)

Final Cut ProMac OS

Web DeveloperCreative Circle

2014

Web DeveloperRobert Half Technologies

2014

DesignerThe Boss Group

20143

DesignerSign-A-Rama DC

2012 - 2013

Lead Data AnalystRandstad, USA

2010 - 2012

Group Team Manager Target Corporation

2009

ACHIVEMENTSACHIVEMENTS

SOFTWARE/LANGUAGES SOFTWARE/LANGUAGES

B.S. Computer ScienceArcadia University

MBA (Marketing) Clark Atlanta University

2009

Graphic Design Certificate Montgomery College

2014

creativeadaptablecollaborativefriendlyagile

Capabilities:

superb writing skillsexceptional leadership abilitiesstrong business acumenstellar verbal skills

Demonstrates:

strong coding best practicesresponsive design508 Compliancemobile first design

Develops imaginitive websites using:

EDUCATIONEDUCATION

EXPERIENCEEXPERIENCEASSETS TO YOUR COMPANYASSETS TO YOUR COMPANY

websiteslanding pagesmicrositesweb emailslayoutsIllustrations

Designs High-Impact:

Dean’s List

* Some items condensed or omitted for brevity

Page 26: Derrick Douglass web design, web development and graphic design  douglass design_and_development_portfolio_2015

Design + Innovate + Create

REACHme

[email protected]

+1.678.439.6082

308 Gruenther AveRockville, MD 20851

www.linkedin.com/derrickdouglass

www.twitter.com/derrickdouglass

www.behance.com/derrickdouglass

Page 27: Derrick Douglass web design, web development and graphic design  douglass design_and_development_portfolio_2015