1.
@danaluther
Integrated Feature Management
Using Feature Flags
Dana Luther

2.
@danaluther
What are we going to do today, Brain?

3.
@danaluther
What are we going to do today, Brain?
What are feature flags?

4.
@danaluther
What are we going to do today, Brain?
What are feature flags?
Why do we want to use them?

5.
@danaluther
What are we going to do today, Brain?
What are feature flags?
Why do we want to use them?
How do we use and integrate them?

6.
@danaluther
What is a feature flag?

7.
@danaluther
What is a feature flag?
A variable that defines a condition

8.
@danaluther
What is a feature flag?
A variable that defines a condition
A feature toggle (also feature switch, feature flag, feature
flipper, conditional feature, etc.) is a technique in software
development that attempts to provide an alternative to maintaining
multiple source-code branches (known as feature branches), such that
a feature can be tested even before it is completed and ready for
release. Feature toggle is used to hide, enable or disable the feature
during run time.
“
“
— Wikipedia

9.
@danaluther
https://featureflags.io

10.
@danaluther
What is integrated management?

11.
@danaluther
What is integrated management?
Defining your conditional such that you don’t need to update your
codebase to switch features.

12.
@danaluther
What is integrated management?
Defining your conditional such that you don’t need to update your
codebase to switch features.
Avoiding feature branches for the win!

13.
@danaluther
Feature branch misery
…the struggle is real…

14.
@danaluther
Feature branch misery …

15.
@danaluther
Feature branch misery …

16.
@danaluther
Feature branch misery …

17.
@danaluther
Feature branch misery …

18.
@danaluther
Feature branch misery …

19.
@danaluther
Feature branch misery …

20.
@danaluther
Feature branch misery …

21.
@danaluther
Feature branch misery …

22.
@danaluther
Feature branch misery …

23.
@danaluther
Feature branch misery …

24.
@danaluther
Feature branch misery …

25.
@danaluther
Feature branch misery …

26.
@danaluther
Feature branch misery …

27.
@danaluther
Feature branch misery …

28.
@danaluther
Feature branch misery …

29.
@danaluther
Feature branch misery …

30.
@danaluther
Feature branch misery …

31.
@danaluther
Feature branch misery …

32.
@danaluther
Feature branch misery …

33.
@danaluther
Feature branch misery …

34.
@danaluther
Feature branch misery …

35.
@danaluther
Feature branch misery …

36.
@danaluther
Feature branch misery …

37.
@danaluther
Feature branch misery …
2 logic * 3 UI =

38.
@danaluther
Can we make it better?

39.
@danaluther
Can we make it better?
Of Course! (Or we wouldn’t be here right now)

40.
@danaluther
Use conditional statements to
consolidate the logic branches

41.
@danaluther
Consolidate logic branches …
master
sleepy-greeting

42.
@danaluther
Consolidate logic branches …

43.
@danaluther
Consolidate logic branches …

44.
@danaluther
Consolidate logic branches …

45.
@danaluther
Consolidated but separated

46.
@danaluther
YAY!!
We can get rid of the sleepy branches!

47.
@danaluther
YAY!!
We can get rid of the sleepy branches!
(And there was much rejoicing)

48.
@danaluther
YAY!!
We can get rid of the sleepy branches!
(And there was much rejoicing)
…but what about our UI features?

49.
@danaluther
Establish condition for view rendering

50.
@danaluther
Establish condition for view rendering

51.
@danaluther

52.
@danaluther
(And there was much rejoicing)

53.
@danaluther
Why do we want to use feature flags?

54.
@danaluther
Why do we want to use feature flags?
A/B Testing

55.
@danaluther
Why do we want to use feature flags?
A/B Testing
Canary Rollouts

56.
@danaluther
Why do we want to use feature flags?
A/B Testing
Canary Rollouts
Maintenance Windows (internal and/or third party)

57.
@danaluther
Why do we want to use feature flags?
A/B Testing
Canary Rollouts
Maintenance Windows (internal and/or third party)
Seasonal Content / Calendar Driven

58.
@danaluther
Why do we want to use feature flags?
A/B Testing
Canary Rollouts
Maintenance Windows (internal and/or third party)
Seasonal Content / Calendar Driven
See more at: http://featureflags.io/feature-flag-uses/

59.
@danaluther
A/B Testing

60.
@danaluther
A/B Testing
Version A - 50%

61.
@danaluther
A/B Testing
Version A - 50% Version B - 50%

62.
@danaluther
Canary Testing

63.
@danaluther
Canary Testing
Version A - 90%

64.
@danaluther
Canary Testing
Version A - 90% Version B - 10%

65.
SIDEBAR:
@danaluther
Why do they call it canary testing?
https://www.smithsonianmag.com/smart-news/story-real-canary-coal-mine-180961570/

66.
@danaluther
Canary Testing
Version A - 90% Version B - 10%

67.
@danaluther
Maintenance Windows
“Offline” Mode

68.
@danaluther
Maintenance Windows
“Normal” Mode “Offline” Mode

69.
@danaluther
Maintenance Windows
“Normal” Mode “Offline” Mode

70.
@danaluther
Seasonal Content

71.
@danaluther
Seasonal Content
“Normal” Mode

72.
@danaluther
Seasonal Content
“Normal” Mode “Annual Contest” Mode

73.
@danaluther
Why do we want to use feature flags?
A/B Testing
Canary Rollouts
Maintenance Windows (internal and/or third party)
Seasonal Content / Calendar Driven
See more at: http://featureflags.io/feature-flag-uses/

74.
@danaluther
How do we use feature flags?

75.
@danaluther
How do we use feature flags?
PHP Libraries:

76.
@danaluther
How do we use feature flags?
PHP Libraries:
https://featureflags.io/php-feature-flags/

77.
@danaluther
How do we use feature flags?
PHP Libraries:
https://featureflags.io/php-feature-flags/
https://packagist.org/ (feature flag search)

78.
@danaluther
How do we use feature flags?
PHP Libraries:
https://featureflags.io/php-feature-flags/
https://packagist.org/ (feature flag search)
https://packagist.org/packages/zumba/swivel

79.
@danaluther
How do we use feature flags?
PHP Libraries:
https://featureflags.io/php-feature-flags/
https://packagist.org/ (feature flag search)
https://packagist.org/packages/zumba/swivel
https://packagist.org/packages/dhluther/yii2-swivel

80.
@danaluther
Key Concept: User Experience Groups
The Cohort

81.
@danaluther
User “Buckets”
Bucket ID 1

82.
@danaluther
User “Buckets”
Bucket ID 1
Bucket ID 2

83.
@danaluther
User “Buckets”
Bucket ID 1
Bucket ID 2
Bucket ID 6

84.
@danaluther
User “Buckets”
1 2 3 4 5 6 7 8 9 10
Each bucket = 10% of visitors

85.
@danaluther
User “Cohort”
1 2 3 4 5 6 7 8 9 10
If they all experience the same thing - they are in the same cohort.

86.
@danaluther
1 2 3 4 5 6 7 8 9 10
The cohort is defined by the experience.
}
}
Feature A - Cohort A Feature B - Cohort B

87.
@danaluther
We know our groups, but does
Google?

88.
SIDEBAR:
@danaluther
https://tagmanager.google.com
https://analytics.google.com
https://support.google.com/analytics/answer/1009612
https://support.google.com/tagmanager/answer/6164391
GTM and Analytics Resources

89.
@danaluther
GTM to Google Analytics - dataLayer
dataLayer = [{
"visitorType":"guest",
"bucketId":2,
"ecommerce":{
"promoView":{
"promotions":[{
"id":"FANCY_WIDGET",
"name":“Fancy Widget",
"creative":"featured-index",
"position":"featured"
}]
}
}
}];

90.
@danaluther
GTM to Google Analytics - dataLayer
dataLayer = [{
"visitorType":"guest",
"bucketId":2,
"ecommerce":{
"promoView":{
"promotions":[{
"id":"FANCY_WIDGET",
"name":“Fancy Widget",
"creative":"featured-index",
"position":"featured"
}]
}
}
}];

91.
@danaluther
Set GTM Variable from dataLayer

92.
@danaluther
Set the Variable to a Dimension value

93.
@danaluther
Google Analytics - Add Dimension

94.
@danaluther
Google Analytics - A/B Segments

95.
@danaluther
Google Analytics - Bucket Segments

96.
SIDEBAR:
@danaluther
Instana APM Resources
https://instana.com

97.
@danaluther
Google is ready … lets try our features

98.
@danaluther
Scenario: Canary Release

99.
@danaluther
Define Feature Slugs
IndexStyle.Fancy IndexStyle.Fancier
IndexStyle

100.
@danaluther
Assign Features to Buckets / Cohorts
Feature Slug Buckets
IndexStyle 1,2,3,4,5,6,7,8,9,10
IndexStyle.Fancy 1,2,3,4,5,6,7,8,9,10
IndexStyle.Fancier 9,10
Canary Rollout of IndexStyle.Fancier

101.
@danaluther
How Swivel interprets the feature slugs

102.
@danaluther
Decouple from code deployment

103.
@danaluther
Decouple from code deployment

104.
@danaluther
Decouple from code deployment

105.
@danaluther
Simple A/B toggle

106.
@danaluther
Canary release the fancier UI

107.
@danaluther
User Breakdown
Default
UI
Fancy
UI
Fancier
UI
IndexStyle.Fancy IndexStyle.Fancier
80% Users0% Users
(Killswitch Fallback)
20% Users

108.
@danaluther
Check Analytics Performance

109.
@danaluther
Fully Release the Feature
Feature Slug Buckets
IndexStyle 1,2,3,4,5,6,7,8,9,10
IndexStyle.Fancy 1,2,3,4,5,6,7,8,9,10
IndexStyle.Fancier 1,2,3,4,5,6,7,8,9,10

110.
@danaluther
Updated User Breakdown
Default
UI
Fancy
UI
Fancier
UI
IndexStyle.Fancy IndexStyle.Fancier
0% Users0% Users
(Killswitch Fallback)
100% Users

111.
@danaluther
Real World Example: New UI
IndexStyle.Fancy IndexStyle.Fancier

112.
@danaluther
Scenario: A/B Test

113.
@danaluther
Define Feature Slugs
Greeting.Sleepy
Greeting

114.
@danaluther
Assign Features to Buckets / Cohorts
Feature Slug Buckets
Greeting 1,2,3,4,5,6,7,8,9,10
Greeting.Sleepy 6,7,8,9,10
AB Test Sleepy Greeting

115.
@danaluther
How Swivel interprets the feature slugs

116.
@danaluther
How Swivel interprets the feature slugs

117.
@danaluther
Flashback - Consolidated Greeting

118.
@danaluther
Flashback - Consolidated Greeting

119.
@danaluther
Vanilla Swivel Install - Swivel Feature

120.
@danaluther
Swivel Feature - A or B

121.
@danaluther
User Breakdown
Default
Greeting
Sleepy
Greeting
Greeting.Sleepy
50% Users50% Users
Cohort A Cohort B

122.
@danaluther
Using Google Analytics: A -vs- B

123.
@danaluther
Assign Features to Buckets / Cohorts
Feature Slug Buckets
Greeting 1,2,3,4,5,6,7,8,9,10
Greeting.Sleepy
AB Test Sleepy Greeting - A Wins

124.
@danaluther
Assign Features to Buckets / Cohorts
Feature Slug Buckets
Deleted all Greeting features
AB Test Sleepy Greeting - A Wins

125.
@danaluther
User Breakdown - Sleepy Disabled
Default
Greeting
Sleepy
Greeting
Greeting.Sleepy
0% Users100% Users
Cohort A Cohort B

126.
@danaluther
Assign Features to Buckets / Cohorts
Feature Slug Buckets
Greeting 1,2,3,4,5,6,7,8,9,10
Greeting.Sleepy 1,2,3,4,5,6,7,8,9,10
AB Test Sleepy Greeting - B Wins

127.
@danaluther
Assign Features to Buckets / Cohorts
Feature Slug Buckets
Greeting
Greeting.Sleepy 1,2,3,4,5,6,7,8,9,10
AB Test Sleepy Greeting - Oops

128.
@danaluther
Assign Features to Buckets / Cohorts
Feature Slug Buckets
Greeting
Greeting.Sleepy 1,2,3,4,5,6,7,8,9,10
AB Test Sleepy Greeting - Oops

129.
@danaluther
User Breakdown - Sleepy Disabled
Default
Greeting
Sleepy
Greeting
Greeting.Sleepy
100% Users0% Users
Cohort A Cohort B

130.
@danaluther
Real World Example: A/B Location
Covid.A Covid.B

131.
@danaluther
Scenario: Maintenance Window

132.
@danaluther
Assign Features to Buckets / Cohorts
Feature Slug Buckets
ThirdPartyAPI 1,2,3,4,5,6,7,8,9,10
ThirdPartyAPI.UnderMaintenance 1,2,3,4,5,6,7,8,9,10

133.
@danaluther
Real World Example: Maintenance
QuotingTool.ProductA.Unavailable

134.
@danaluther
Scenario: Seasonal Content

135.
@danaluther
Assign Features to Buckets / Cohorts
Feature Slug Buckets
OurCrazyContest 1,2,3,4,5,6,7,8,9,10
OurCrazyContest.AcceptingEntries 1,2,3,4,5,6,7,8,9,10
OurCrazyContest.VotingOpen
OurCrazyContest.FinalistsAnnounced

136.
@danaluther
Real World Example: Seasonal/Temp.
ISI.Coronavirus.Alert

137.
@danaluther
Automate Feature Toggling

138.
@danaluther
Automate Feature Toggling
Cron or system.d timers

139.
@danaluther
Automate Feature Toggling
Cron or system.d timers
Services that trigger database updates

140.
@danaluther
Automate Feature Toggling
Cron or system.d timers
Services that trigger database updates
Sequential API failures automatically trigger ClientApi.Unavailable slug
creation

141.
@danaluther
Automate Feature Toggling
Cron or system.d timers
Services that trigger database updates
Sequential API failures automatically trigger ClientApi.Unavailable slug
creation
?? You tell me!

142.
@danaluther
https://featureflags.io

143.
@danaluther
Questions??
🤔
?
? ?
?
https://www.linkedin.com/in/danaluther
dluther@envisageinternational.com