Loading presentation...

Present Remotely

Send the link below via email or IM

Copy

Present to your audience

Start remote presentation

  • Invited audience members will follow you as you navigate and present
  • People invited to a presentation do not need a Prezi account
  • This link expires 10 minutes after you close the presentation
  • A maximum of 30 users can follow your presentation
  • Learn more about this feature in our knowledge base article

Do you really want to delete this prezi?

Neither you, nor the coeditors you shared it with will be able to recover it again.

DeleteCancel

Make your likes visible on Facebook?

Connect your Facebook account to Prezi and let your likes appear on your timeline.
You can change this under Settings & Account at any time.

No, thanks

An introduction to website design for beginners

No description
by

Gary Cooper

on 17 September 2012

Comments (0)

Please log in to add your comment.

Report abuse

Transcript of An introduction to website design for beginners

An introduction to the UX & UI Design Process Web Design What's the PURPOSE?
What are the main GOALS?
Who's the AUDIENCE? Requirements Features and functionality?
Common content?
Example solutions?
Ideas and concepts... Value Add! A defined brief...
and an agreed scope... Record it! Designing
the UI UX! 1) User stories/journeys Evolution... 2) Site map 3) Wire frame Define the USERS and their GOALS... User Stories Complex: As a (USER) I want a (GOAL) so that (BENEFIT).... Site Map How do the "stories" start and flow together... Define GLOBAL and PAGE SPECIFIC content
Create outline LAYOUT and page structure
Place elements LOGICALLY
Emphasise and add ATTENTION
Define workflows and user experience(s)
Wire Frames The application of UI Design Logo, fonts, colour
image and style Look & Feel Identity Basics Apply UI design...
Brand recognition
Emphasise elements
Add structure
Help guide the journeys... There's no template formula!
Design for the purpose of the site
Design with space & avoid clutter! Easy on the eye
Plan contrast (content, navigation and 'features')
Think legibility! Can I read it? Is it easy to follow?
Use colour sparingly. E.g. 2 primary and an accent
Consider the audience; what would appeal? So.... Be under the influence!
Recreate designs + adjust them for your
purpose to learn the basics! Avoid... FADS for the sake of it (e.g. filters)
Fitting content into a LOOK
Ignoring your EVOLVED understanding
Ignoring accessibility*
Skipping any process step Enough
Theory... Questions
& Answers... Quick Task Think of a website and write down...
It's core PURPOSE (1 or 2)
It's main GOAL(s)
The target AUDIENCE Task 2 1) What would a user story be for FaceBook? Other?
2) Sketch a login with "edge cases" Task 3 Think of a website you like the 'design' of. What is it that you like about it? Is it just the graphics? Task 3 Share a website with the group...
Describe the design...
What do you like about it? Consider conventions and user expectations! What are others doing? You're the expert.... You're ready to start work! Design evolves Simple: Login to access reports What are the signpost pages? SKIN Attention
Mapping Greyscale
Design Test *Accessibility is its own session! Is design?
Is it UI? UX? to the UX Wire Frame
Full transcript