Responsive design workflow:
Gespeichert in:
1. Verfasser: | |
---|---|
Format: | Buch |
Sprache: | English |
Veröffentlicht: |
[San Francisco, CA]
New Riders
2013
|
Schlagworte: | |
Online-Zugang: | Inhaltsverzeichnis |
Beschreibung: | Includes bibliographical references and index |
Beschreibung: | XV, 223 S. Ill., graph. Darst. 23 cm |
ISBN: | 9780321887863 0321887867 |
Internformat
MARC
LEADER | 00000nam a2200000 c 4500 | ||
---|---|---|---|
001 | BV041081386 | ||
003 | DE-604 | ||
005 | 20130910 | ||
007 | t | ||
008 | 130611s2013 ad|| |||| 00||| eng d | ||
020 | |a 9780321887863 |9 978-0-321-88786-3 | ||
020 | |a 0321887867 |9 0-321-88786-7 | ||
020 | |z 9780321887863 |9 9780321887863 | ||
035 | |a (OCoLC)854725716 | ||
035 | |a (DE-599)BVBBV041081386 | ||
040 | |a DE-604 |b ger |e rakwb | ||
041 | 0 | |a eng | |
049 | |a DE-473 |a DE-83 | ||
084 | |a ST 252 |0 (DE-625)143627: |2 rvk | ||
100 | 1 | |a Hay, Stephen |e Verfasser |4 aut | |
245 | 1 | 0 | |a Responsive design workflow |c Stephen Hay |
264 | 1 | |a [San Francisco, CA] |b New Riders |c 2013 | |
300 | |a XV, 223 S. |b Ill., graph. Darst. |c 23 cm | ||
336 | |b txt |2 rdacontent | ||
337 | |b n |2 rdamedia | ||
338 | |b nc |2 rdacarrier | ||
500 | |a Includes bibliographical references and index | ||
650 | 4 | |a Web site development | |
650 | 4 | |a Web sites / Design | |
650 | 0 | 7 | |a Gestaltung |0 (DE-588)4157139-3 |2 gnd |9 rswk-swf |
650 | 0 | 7 | |a Web-Seite |0 (DE-588)4356308-9 |2 gnd |9 rswk-swf |
689 | 0 | 0 | |a Web-Seite |0 (DE-588)4356308-9 |D s |
689 | 0 | 1 | |a Gestaltung |0 (DE-588)4157139-3 |D s |
689 | 0 | |5 DE-604 | |
856 | 4 | 2 | |m Digitalisierung UB Bamberg |q application/pdf |u http://bvbr.bib-bvb.de:8991/F?func=service&doc_library=BVB01&local_base=BVB01&doc_number=026058169&sequence=000002&line_number=0001&func_code=DB_RECORDS&service_type=MEDIA |3 Inhaltsverzeichnis |
999 | |a oai:aleph.bib-bvb.de:BVB01-026058169 |
Datensatz im Suchindex
_version_ | 1804150452907933696 |
---|---|
adam_text | CONTENTS
vii
Contents
Foreword
by Ethan
Marcotte
XV
ι
In Splendid Variety These Changes Come
ι
The birth of static hi-fi mockups
....................2
The static mockup comfort zone
...................4
The specialist invasion
.........................5
We re all interaction designers
....................8
Jump from the waterfall
........................8
The straw that broke
...........................9
The elephant in the room
.......................10
This is not gospel
............................11
This
¡s a
challenge
...........................12
Microstructure
vs. modular structure
................14
The lazy person s content inventory
.................16
Our universal example: This book s website
.............16
Progressive enhancement as design principle:
The zero interface
..........................17
Creatingthe example content inventory
...............19
Try it out
................................22
Viii CONTENTS
Content Reference Wireframes
Stop making this stuff so complicated
.................27
Baby steps: Creating low-fi web-based wireframes
.........29
Setting up your base markup
.....................29
Setting up your base styles
......................32
Adjusting the wireframe to be mobile first
.............35
Adding navigation
..........................37
Creating variants for larger screen sizes
...............39
Let s bust some myths
.........................46
Interaction designers should make wireframes
............46
Wireframes should be detailed
....................47
Do content reference wireframes limit design choices?
........47
Isn t it too early to think about layout?
................48
What should I wireframe?
......................48
When do I involve the client
(a.k.a. Where s my fancy deliverable? )
...............49
Try it out
................................49
CONTENTS
ІХ
*■
Designing in Text
It s all content.............................
52
Starting design with plain text
....................54
Marking up plain text
.........................55
The book page text in
Markdown
...................56
What changes mean at this point
...................59
It s about thinking
..........................61
Converting plain text to HTML
....................61
Using the command line
.......................62
Converting to HTML
.........................66
Linear Design
Developing a design language
.....................70
Using the Design Funnel
.......................71
Serve your design to actual devices
..................74
Enhancing your structured content
..................76
Introducing templates
........................78
Your project
f
older so far
.......................81
Think and sketch
...........................81
Playing with type and color
......................83
Don t do too much just yet
......................87
CONTENTS
Breakpoint Graphs
Documentation for breakpoints
....................92
Anatomy of a breakpoint
.......................92
Visualizing breakpoints
.......................95
Breakpoint graph components
....................95
Creating a simple breakpoint graph
..................97
Major and minor breakpoints
....................100
Adding more complexity
.......................101
A more complex example: A podcast player
.............102
What we ve covered
.........................105
First, a bit about sketching
......................108
How to sketch
...........................109
Sketching on devices
........................113
Sketching as a habit
........................115
Only sweat the major breakpoints (for now)
............116
Think about your content while sketching
.............118
Text
................................119
Navigation
.............................119
Tables
...............................120
What to do if you get stuck
.....................123
CONTENTS
xi
8
Creating a Web-Based Design Mockup
Hurdles to acceptance
.......................127
Clients (generally) don t care
....................127
Otherpeople
............................128
You
.................................130
Presenting your mockups
......................132
Let s get to work
...........................132
Evolving your responsive wireframe
................133
From static page to static site generator
..............139
Templating
.............................139
Choosing an SSG
..........................140
Introducing Dexy
..........................141
Installing Dexy
...........................142
Get your assets in here!
......................146
Including style sheets
........................146
Adding content
...........................148
Sectioning content
.........................148
Dexy s command center. The dexy.yaml file
.............151
Finishing your design mockup with CSS
..............153
Multiple pages
...........................154
What we ve covered
.........................156
xii CONTENTS
Presentation, Round One:
Screenshots
Why not present in the browser right away?
............159
The presentation/realism balance
.................159
Screenshots:
Going from web-based (back) to ¡mages
........161
How to make
Screenshots......................163
Manual
Screenshots........................163
Automated
Screenshots......................164
Presenting
Screenshots.......................169
Presentation, Round Two: In the Browser 7I
You ll find many bugs in your design
.................172
Collaboration and communication
.................173
How to present your interactive mockups
.............175
Use devices to impress
.......................175
Explaining your design
.......................176
Testing and client review
......................177
Client review
............................178
Take good notes
..........................179
Using your notes and making revisions
...............184
CONTENTS xiii
її
Creating Design Guidelines
Design manuals and the web
....................189
Thecontent and structure of design guidelines
...........191
Websites are different
.......................192
My wish list for design guideline software
.............193
Creating your design documentation
................195
Writing the documentation
....................196
Inserting example material
.....................198
Creating
Screenshots........................199
Making the Dexy
configuration
file
.................200
Testing your Dexy project
......................201
Taking
Screenshots
of specific elements
...............202
Including rendered HTML
.....................204
Including syntax-highlighted code
.................206
Making the documentation your own
................210
Now it s time to go
..........................211
Index
из
|
any_adam_object | 1 |
author | Hay, Stephen |
author_facet | Hay, Stephen |
author_role | aut |
author_sort | Hay, Stephen |
author_variant | s h sh |
building | Verbundindex |
bvnumber | BV041081386 |
classification_rvk | ST 252 |
ctrlnum | (OCoLC)854725716 (DE-599)BVBBV041081386 |
discipline | Informatik |
format | Book |
fullrecord | <?xml version="1.0" encoding="UTF-8"?><collection xmlns="http://www.loc.gov/MARC21/slim"><record><leader>01485nam a2200397 c 4500</leader><controlfield tag="001">BV041081386</controlfield><controlfield tag="003">DE-604</controlfield><controlfield tag="005">20130910 </controlfield><controlfield tag="007">t</controlfield><controlfield tag="008">130611s2013 ad|| |||| 00||| eng d</controlfield><datafield tag="020" ind1=" " ind2=" "><subfield code="a">9780321887863</subfield><subfield code="9">978-0-321-88786-3</subfield></datafield><datafield tag="020" ind1=" " ind2=" "><subfield code="a">0321887867</subfield><subfield code="9">0-321-88786-7</subfield></datafield><datafield tag="020" ind1=" " ind2=" "><subfield code="z">9780321887863</subfield><subfield code="9">9780321887863</subfield></datafield><datafield tag="035" ind1=" " ind2=" "><subfield code="a">(OCoLC)854725716</subfield></datafield><datafield tag="035" ind1=" " ind2=" "><subfield code="a">(DE-599)BVBBV041081386</subfield></datafield><datafield tag="040" ind1=" " ind2=" "><subfield code="a">DE-604</subfield><subfield code="b">ger</subfield><subfield code="e">rakwb</subfield></datafield><datafield tag="041" ind1="0" ind2=" "><subfield code="a">eng</subfield></datafield><datafield tag="049" ind1=" " ind2=" "><subfield code="a">DE-473</subfield><subfield code="a">DE-83</subfield></datafield><datafield tag="084" ind1=" " ind2=" "><subfield code="a">ST 252</subfield><subfield code="0">(DE-625)143627:</subfield><subfield code="2">rvk</subfield></datafield><datafield tag="100" ind1="1" ind2=" "><subfield code="a">Hay, Stephen</subfield><subfield code="e">Verfasser</subfield><subfield code="4">aut</subfield></datafield><datafield tag="245" ind1="1" ind2="0"><subfield code="a">Responsive design workflow</subfield><subfield code="c">Stephen Hay</subfield></datafield><datafield tag="264" ind1=" " ind2="1"><subfield code="a">[San Francisco, CA]</subfield><subfield code="b">New Riders</subfield><subfield code="c">2013</subfield></datafield><datafield tag="300" ind1=" " ind2=" "><subfield code="a">XV, 223 S.</subfield><subfield code="b">Ill., graph. Darst.</subfield><subfield code="c">23 cm</subfield></datafield><datafield tag="336" ind1=" " ind2=" "><subfield code="b">txt</subfield><subfield code="2">rdacontent</subfield></datafield><datafield tag="337" ind1=" " ind2=" "><subfield code="b">n</subfield><subfield code="2">rdamedia</subfield></datafield><datafield tag="338" ind1=" " ind2=" "><subfield code="b">nc</subfield><subfield code="2">rdacarrier</subfield></datafield><datafield tag="500" ind1=" " ind2=" "><subfield code="a">Includes bibliographical references and index</subfield></datafield><datafield tag="650" ind1=" " ind2="4"><subfield code="a">Web site development</subfield></datafield><datafield tag="650" ind1=" " ind2="4"><subfield code="a">Web sites / Design</subfield></datafield><datafield tag="650" ind1="0" ind2="7"><subfield code="a">Gestaltung</subfield><subfield code="0">(DE-588)4157139-3</subfield><subfield code="2">gnd</subfield><subfield code="9">rswk-swf</subfield></datafield><datafield tag="650" ind1="0" ind2="7"><subfield code="a">Web-Seite</subfield><subfield code="0">(DE-588)4356308-9</subfield><subfield code="2">gnd</subfield><subfield code="9">rswk-swf</subfield></datafield><datafield tag="689" ind1="0" ind2="0"><subfield code="a">Web-Seite</subfield><subfield code="0">(DE-588)4356308-9</subfield><subfield code="D">s</subfield></datafield><datafield tag="689" ind1="0" ind2="1"><subfield code="a">Gestaltung</subfield><subfield code="0">(DE-588)4157139-3</subfield><subfield code="D">s</subfield></datafield><datafield tag="689" ind1="0" ind2=" "><subfield code="5">DE-604</subfield></datafield><datafield tag="856" ind1="4" ind2="2"><subfield code="m">Digitalisierung UB Bamberg</subfield><subfield code="q">application/pdf</subfield><subfield code="u">http://bvbr.bib-bvb.de:8991/F?func=service&doc_library=BVB01&local_base=BVB01&doc_number=026058169&sequence=000002&line_number=0001&func_code=DB_RECORDS&service_type=MEDIA</subfield><subfield code="3">Inhaltsverzeichnis</subfield></datafield><datafield tag="999" ind1=" " ind2=" "><subfield code="a">oai:aleph.bib-bvb.de:BVB01-026058169</subfield></datafield></record></collection> |
id | DE-604.BV041081386 |
illustrated | Illustrated |
indexdate | 2024-07-10T00:39:09Z |
institution | BVB |
isbn | 9780321887863 0321887867 |
language | English |
oai_aleph_id | oai:aleph.bib-bvb.de:BVB01-026058169 |
oclc_num | 854725716 |
open_access_boolean | |
owner | DE-473 DE-BY-UBG DE-83 |
owner_facet | DE-473 DE-BY-UBG DE-83 |
physical | XV, 223 S. Ill., graph. Darst. 23 cm |
publishDate | 2013 |
publishDateSearch | 2013 |
publishDateSort | 2013 |
publisher | New Riders |
record_format | marc |
spelling | Hay, Stephen Verfasser aut Responsive design workflow Stephen Hay [San Francisco, CA] New Riders 2013 XV, 223 S. Ill., graph. Darst. 23 cm txt rdacontent n rdamedia nc rdacarrier Includes bibliographical references and index Web site development Web sites / Design Gestaltung (DE-588)4157139-3 gnd rswk-swf Web-Seite (DE-588)4356308-9 gnd rswk-swf Web-Seite (DE-588)4356308-9 s Gestaltung (DE-588)4157139-3 s DE-604 Digitalisierung UB Bamberg application/pdf http://bvbr.bib-bvb.de:8991/F?func=service&doc_library=BVB01&local_base=BVB01&doc_number=026058169&sequence=000002&line_number=0001&func_code=DB_RECORDS&service_type=MEDIA Inhaltsverzeichnis |
spellingShingle | Hay, Stephen Responsive design workflow Web site development Web sites / Design Gestaltung (DE-588)4157139-3 gnd Web-Seite (DE-588)4356308-9 gnd |
subject_GND | (DE-588)4157139-3 (DE-588)4356308-9 |
title | Responsive design workflow |
title_auth | Responsive design workflow |
title_exact_search | Responsive design workflow |
title_full | Responsive design workflow Stephen Hay |
title_fullStr | Responsive design workflow Stephen Hay |
title_full_unstemmed | Responsive design workflow Stephen Hay |
title_short | Responsive design workflow |
title_sort | responsive design workflow |
topic | Web site development Web sites / Design Gestaltung (DE-588)4157139-3 gnd Web-Seite (DE-588)4356308-9 gnd |
topic_facet | Web site development Web sites / Design Gestaltung Web-Seite |
url | http://bvbr.bib-bvb.de:8991/F?func=service&doc_library=BVB01&local_base=BVB01&doc_number=026058169&sequence=000002&line_number=0001&func_code=DB_RECORDS&service_type=MEDIA |
work_keys_str_mv | AT haystephen responsivedesignworkflow |