OutsiderIn v3 Redesign
Welcome to the new OutsiderIn.
You may have noticed a design change in the OutsiderIn Account
family, and that is because of our new design language called
OutsiderIn v3
. This article will describe all of the ins
and outs of our new design language.
Flow
Our design is intended to create a natural flow of content, and only separate sections when the main subject changes.
There are some exceptions for when the content is a list of blocks of content. In that case, separating the blocks into their own sections is the better choice.
Depth
Every container block has a perception of being raised up from the background, with a drop shadow applied to every container.
Every container also has a slightly visible border to add an extra element of depth.
To be compliant with OutsiderIn v3
, just use the mica class on container elements.
Blur
All container blocks have a mica blur effect to add an extra fancy effect, and to allow you to know there is content behind the container, if any.
To be compliant with OutsiderIn v3
, just use the mica class on container elements.
Balance
Balance is a key feature of our design, as it allows everyone to see the key parts of something quickly.
Balance involves centering important content within a container
Since this functionality isn't built-in to our stylesheet, you'll
have to implement it manually to be compliant with OutsiderIn
v3
.
How to be checked for compliance
You can easily get checked by using the OutsiderIn Requests page. From there you will recieve a score after a review.
A score of more than 700 means you are compliant enough to correctly
say you are using the OutsiderIn v3
design language. A score of
1000 means you have perfectly followed the specifications.
Note: If you change domain names, you will need to request for a new review.