Brian Dys – Creative Leadership

RE:Creation Category Archive Index

17 Entries

RE:Creation No. 1: Nutrition Facts Label | CSS (Round 2)

Published on 20 Oct 2018 16:38:27

Updated on 20 Oct 2018 16:38:27

Published by

Categories

RE:Creation

0 Comment

Summary

Style for Colors
Style for Graphics
Style for Typography

Demo

See the Pen RE:Creation No. 2: Nutrition Facts Label | CSS (Round 2) by Brian Dys (@briandys) on CodePen.

RE:Creation No. 1: Nutrition Facts Label | CSS (Round 1)

Published on 20 Oct 2018 16:34:01

Updated on 20 Oct 2018 16:34:01

Published by

Categories

RE:Creation

0 Comment

Summary

Style for the Layout

Demo

See the Pen RE:Creation No. 2: Nutrition Facts Label | CSS (Round 1) by Brian Dys (@briandys) on CodePen.

RE:Creation No. 1: Nutrition Facts Label | HTML (Round 2)

Published on 5 Oct 2018 19:08:51

Updated on 5 Oct 2018 19:08:51

Published by

Categories

RE:Creation

0 Comment

Summary

Convert the Tags into <div> and <span>
Classify the Elements by Adding class Attribute

RE:Creation No. 1: Nutrition Facts Label | HTML (Round 1)

Published on 5 Oct 2018 19:04:28

Updated on 5 Oct 2018 19:04:28

Published by

Categories

RE:Creation

0 Comment

Summary

Start with the Basic HTML Document Markup
Mark up the Structure, Groups, and Individuals in HTML

RE:Creation No. 1: Nutrition Facts Label | Plain Text (Round 2)

Published on 5 Oct 2018 10:11:15

Updated on 5 Oct 2018 10:11:15

Published by

Categories

RE:Creation

0 Comment

Summary

Group and Label Content
Structure the Groups Using HMF

RE:Creation No. 1: Nutrition Facts Label | Plain Text (Round 1)

Published on 1 Oct 2018 15:28:07

Updated on 1 Oct 2018 15:28:07

Published by

Categories

RE:Creation

0 Comment

Introduction

In this second episode of RE:Creation, we’re going to re-create something that we’re all familiar with—the Nutrition Facts Label. This particular design is specific to U.S. Food and Drug Administration—although most nutrition information from other countries appear similar in terms of their tabular design.

RE:Creation No. 1: Google | JS (Round 1)

Published on 26 Sep 2018 23:34:39

Updated on 26 Sep 2018 23:34:39

Published by

Categories

RE:Creation

0 Comment

Summary

Code the behavior of Interactivity

RE:Creation No. 1: Google | CSS (Round 3)

Published on 25 Sep 2018 12:54:51

Updated on 25 Sep 2018 12:54:51

Published by

Categories

RE:Creation

0 Comment

Summary

Style for Visual Design: Visual Content
Style for Visual Design: Typography

RE:Creation No. 1: Google | CSS (Round 2)

Published on 21 Sep 2018 17:24:48

Updated on 21 Sep 2018 17:24:48

Published by

Categories

RE:Creation

0 Comment

Summary

Style for Usability: Interactivity
Style for Visual Design: Colors & Graphic Elements of Groups
Style for Visual Design: Layout

RE:Creation No. 1: Google | CSS (Round 1)

Published on 20 Sep 2018 13:37:02

Updated on 20 Sep 2018 13:37:02

Published by

Categories

RE:Creation

0 Comment

Summary

Style for Usability of Interactive Elements: Active Area
Style for Visual Design: Colors & Graphic Elements of Individuals