Briefer: UX design process

  • View
    63

  • Download
    0

  • Category

    Design

Preview:

DESCRIPTION

The showcase presentation of the UX design process for the RSS reader for iOS.

Citation preview

Briefer

17/04/2014, by Andriy Vaskiv

Agenda

• Task• Research• Requiremens• IA• Wireframes• UI• Demo

Task

Due to the discontinuation of the Google Reader design alternative RSS reader for iOS.

Research

• Survey

• “Competitors” analysis

Research: Survey

25

6

4

0

Used RSS reader,IT – 80%

Use RSS-reader now, IT – 50%

Used Google Reader

Women

Research: Target user

20-40 y.o.

average computer skills

man (most likely)

Research: “Competitors” analysis

Google reader

Pros

• Rich functionality with Categories and feeds• ability to star item w/o opening it

Cons

• messy UI with duplication of controls• starring and keep unread?

Research: “Competitors” analysis

Feedly

Pros

• Almost perfect• Various views• Context hints

Cons

• no categories editing functionality• can’t star item w/o opening it• UI for iPad and iPhone versions is not consistent• iPhone - menu icons are rather confusing

Research: “Competitors” analysis

FeedDemon

Pros

• ??? (Rich functionality?)

Cons

• Visually extraoverloaded

Requirements

• Content rules– Typography– Different views– Grid

• Navigation– Categories– Feeds

• Search for feeds

• Sharing

IA

Entities: Category Feed ArticleRelationship: hierarchical

View modes

Article Category -> Feed -> Articles -> Article

Feed Category -> Feed -> Articles

Category Category -> Articles for all feeds within Category

All updates All new unread articles regardless the Category and Feed

Starred All articles marked as starred regardless the Category and Feed

Recently viewed All articles viewed recently regardless the Category and Feed

Typography

Sans serif Lato

Serif Georgia

Typography: The 3 Fundamental Dimensions

Font size: 16px -> line height: 26px, line width: 685px

Typography

Lato

Times New Roman

Georgia

685px

GridiPad Landscape

Views

•Tiles

•Details

•Headers only

Wireframes

UI

Demo

http://a0441w.axshare.comiPad landscape

Thank you

?