diff --git a/frontend/common/services/useProjectFlag.ts b/frontend/common/services/useProjectFlag.ts
index 1456f02f9adb..c481451783ce 100644
--- a/frontend/common/services/useProjectFlag.ts
+++ b/frontend/common/services/useProjectFlag.ts
@@ -199,6 +199,7 @@ export const projectFlagService = service
         invalidatesTags: (res) => [
           { id: 'LIST', type: 'ProjectFlag' },
           { id: res?.id, type: 'ProjectFlag' },
+          { id: 'LIST', type: 'FeatureList' },
         ],
         query: (query: Req['updateProjectFlag']) => ({
           body: query.body,
diff --git a/frontend/common/stores/feature-list-store.ts b/frontend/common/stores/feature-list-store.ts
index 236948040d55..ba53919b6528 100644
--- a/frontend/common/stores/feature-list-store.ts
+++ b/frontend/common/stores/feature-list-store.ts
@@ -156,7 +156,10 @@ const controller = {
           }
           store.model.lastSaved = new Date().valueOf()
           getStore().dispatch(
-            projectFlagService.util.invalidateTags(['ProjectFlag']),
+            projectFlagService.util.invalidateTags([
+              'ProjectFlag',
+              'FeatureList',
+            ]),
           )
 
           store.saved({ createdFlag: flag.name })
@@ -208,7 +211,10 @@ const controller = {
           store.model.features[index] = controller.parseFlag(flag)
           store.model.lastSaved = new Date().valueOf()
           getStore().dispatch(
-            projectFlagService.util.invalidateTags(['ProjectFlag']),
+            projectFlagService.util.invalidateTags([
+              'ProjectFlag',
+              'FeatureList',
+            ]),
           )
           store.changed()
         }
@@ -496,7 +502,10 @@ const controller = {
             }
             onComplete && onComplete()
             getStore().dispatch(
-              projectFlagService.util.invalidateTags(['ProjectFlag']),
+              projectFlagService.util.invalidateTags([
+                'ProjectFlag',
+                'FeatureList',
+              ]),
             )
             store.saved({})
           })
@@ -767,7 +776,10 @@ const controller = {
             throw version.error
           }
           getStore().dispatch(
-            projectFlagService.util.invalidateTags(['ProjectFlag']),
+            projectFlagService.util.invalidateTags([
+              'ProjectFlag',
+              'FeatureList',
+            ]),
           )
           if (!store.model) {
             return
diff --git a/frontend/web/components/experiments/VariationTable/VariationTable.scss b/frontend/web/components/experiments/VariationTable/VariationTable.scss
index bb7fb71b2b55..c8293a23db8c 100644
--- a/frontend/web/components/experiments/VariationTable/VariationTable.scss
+++ b/frontend/web/components/experiments/VariationTable/VariationTable.scss
@@ -19,12 +19,9 @@
     letter-spacing: 0.02em;
 
     &--name,
-    &--desc {
-      flex: 1;
-    }
-
+    &--desc,
     &--value {
-      min-width: 120px;
+      flex: 1;
     }
   }
 
@@ -47,7 +44,8 @@
       align-items: center;
       gap: 8px;
       flex: 1;
-      min-width: 0;
+      min-width: 120px;
+      white-space: nowrap;
     }
 
     &--desc {
@@ -57,9 +55,8 @@
     }
 
     &--value {
-      min-width: 120px;
-      flex-shrink: 0;
-      word-break: break-word;
+      flex: 1;
+      min-width: 0;
     }
   }
 
@@ -85,11 +82,16 @@
   }
 
   &__value-badge {
+    display: inline-block;
     font-family: var(--font-family);
     font-size: var(--font-body-sm-size);
     color: var(--color-text-default);
     background: var(--color-surface-muted);
     padding: 6px 12px;
     border-radius: var(--radius-md);
+    word-break: break-all;
+    max-width: 100%;
+    max-height: 120px;
+    overflow-y: auto;
   }
 }
diff --git a/frontend/web/components/experiments/VariationTable/VariationTable.tsx b/frontend/web/components/experiments/VariationTable/VariationTable.tsx
index 8e810b3e4d13..1f2150af8d9b 100644
--- a/frontend/web/components/experiments/VariationTable/VariationTable.tsx
+++ b/frontend/web/components/experiments/VariationTable/VariationTable.tsx
@@ -9,6 +9,16 @@ type VariationTableProps = {
   variations: MultivariateOption[]
 }
 
+const getVariantLetter = (index: number): string => {
+  let result = ''
+  let n = index
+  do {
+    result = String.fromCharCode(65 + (n % 26)) + result
+    n = Math.floor(n / 26) - 1
+  } while (n >= 0)
+  return result
+}
+
 const getVariationValue = (mv: MultivariateOption) => {
   if (mv.type === 'unicode') return mv.string_value
   if (mv.type === 'int') return String(mv.integer_value ?? '')
@@ -46,28 +56,38 @@ const VariationTable: FC<VariationTableProps> = ({
           </span>
         </div>
         <div className='variation-table__cell variation-table__cell--value'>
-          <span className='variation-table__value-badge'>{controlValue}</span>
+          {controlValue ? (
+            <span className='variation-table__value-badge' title={controlValue}>
+              {controlValue}
+            </span>
+          ) : null}
         </div>
       </div>
 
-      {variations.map((mv) => (
-        <div key={mv.id} className='variation-table__row'>
-          <div className='variation-table__cell variation-table__cell--name'>
-            <ColorSwatch color={colorTextAction} size='md' shape='circle' />
-            <span className='variation-table__name-text'>
-              {mv.string_value || `Variation ${mv.id}`}
-            </span>
+      {variations.map((mv, index) => {
+        const value = getVariationValue(mv)
+        const letter = getVariantLetter(index)
+        return (
+          <div key={mv.id} className='variation-table__row'>
+            <div className='variation-table__cell variation-table__cell--name'>
+              <ColorSwatch color={colorTextAction} size='md' shape='circle' />
+              <span className='variation-table__name-text'>
+                {`Variant ${letter}`}
+              </span>
+            </div>
+            <div className='variation-table__cell variation-table__cell--desc'>
+              <span className='variation-table__desc-text' />
+            </div>
+            <div className='variation-table__cell variation-table__cell--value'>
+              {value ? (
+                <span className='variation-table__value-badge' title={value}>
+                  {value}
+                </span>
+              ) : null}
+            </div>
           </div>
-          <div className='variation-table__cell variation-table__cell--desc'>
-            <span className='variation-table__desc-text' />
-          </div>
-          <div className='variation-table__cell variation-table__cell--value'>
-            <span className='variation-table__value-badge'>
-              {getVariationValue(mv)}
-            </span>
-          </div>
-        </div>
-      ))}
+        )
+      })}
     </div>
   )
 }
diff --git a/frontend/web/components/experiments/steps/MeasurementStep.tsx b/frontend/web/components/experiments/steps/MeasurementStep.tsx
index 7f977518d469..9f11203023ea 100644
--- a/frontend/web/components/experiments/steps/MeasurementStep.tsx
+++ b/frontend/web/components/experiments/steps/MeasurementStep.tsx
@@ -8,13 +8,15 @@ const MeasurementStep: FC = () => {
     <div className='d-flex flex-column gap-4'>
       <ContentCard title='Metrics'>
         <div className='d-flex align-items-center gap-3'>
-          <Input
-            type='text'
-            placeholder='Search metrics...'
-            disabled
-            search
-            size='small'
-          />
+          <div className='flex-fill'>
+            <Input
+              type='text'
+              placeholder='Search metrics...'
+              disabled
+              search
+              size='small'
+            />
+          </div>
           <Button disabled theme='outline'>
             <Icon name='plus' width={16} />
             Create Metric
diff --git a/frontend/web/components/experiments/steps/ReviewStep.tsx b/frontend/web/components/experiments/steps/ReviewStep.tsx
index 1360114dd30b..4b6b5742a7cb 100644
--- a/frontend/web/components/experiments/steps/ReviewStep.tsx
+++ b/frontend/web/components/experiments/steps/ReviewStep.tsx
@@ -47,7 +47,10 @@ const ReviewStep: FC<ReviewStepProps> = ({
               </span>
             </div>
             <VariationTable
-              controlValue={selectedFeature.initial_value?.toString() ?? ''}
+              controlValue={
+                selectedFeature.environment_feature_state?.feature_state_value?.toString() ??
+                ''
+              }
               variations={selectedFeature.multivariate_options}
             />
           </>
diff --git a/frontend/web/components/experiments/steps/SetupStep.scss b/frontend/web/components/experiments/steps/SetupStep.scss
index a6238a24a405..c1c82f94ace7 100644
--- a/frontend/web/components/experiments/steps/SetupStep.scss
+++ b/frontend/web/components/experiments/steps/SetupStep.scss
@@ -1,3 +1,17 @@
+.wizard-field .react-select__menu-list {
+  scrollbar-width: thin;
+
+  &::-webkit-scrollbar {
+    display: block;
+    width: 6px;
+  }
+
+  &::-webkit-scrollbar-thumb {
+    background: var(--color-border-default);
+    border-radius: 3px;
+  }
+}
+
 .wizard-field {
   display: flex;
   flex-direction: column;
diff --git a/frontend/web/components/experiments/steps/SetupStep.tsx b/frontend/web/components/experiments/steps/SetupStep.tsx
index c240802f3f06..d69c071d3364 100644
--- a/frontend/web/components/experiments/steps/SetupStep.tsx
+++ b/frontend/web/components/experiments/steps/SetupStep.tsx
@@ -128,7 +128,10 @@ const SetupStep: FC<SetupStepProps> = ({
           <div className='wizard-field'>
             <label className='wizard-field__label'>Variations</label>
             <VariationTable
-              controlValue={selectedFeature.initial_value?.toString() ?? ''}
+              controlValue={
+                selectedFeature.environment_feature_state?.feature_state_value?.toString() ??
+                ''
+              }
               variations={selectedFeature.multivariate_options}
             />
           </div>
diff --git a/frontend/web/components/pages/ExperimentsPage.tsx b/frontend/web/components/pages/ExperimentsPage.tsx
index c5515131446b..49179fbb6b39 100644
--- a/frontend/web/components/pages/ExperimentsPage.tsx
+++ b/frontend/web/components/pages/ExperimentsPage.tsx
@@ -32,6 +32,10 @@ const ExperimentsPage: FC = () => {
     setPage(1)
   }, [activeTab, search])
 
+  useEffect(() => {
+    setIsCreating(false)
+  }, [environmentId])
+
   const { data: experimentsData, isLoading } = useGetExperimentsQuery(
     {
       environmentId: environmentId ?? '',
diff --git a/frontend/web/styles/3rdParty/_react-select.scss b/frontend/web/styles/3rdParty/_react-select.scss
index 92e1148f646b..9c3753baba18 100644
--- a/frontend/web/styles/3rdParty/_react-select.scss
+++ b/frontend/web/styles/3rdParty/_react-select.scss
@@ -12,7 +12,7 @@
     -ms-overflow-style: none;
 
     &::-webkit-scrollbar {
-      display: none; 
+      display: none;
     }
   }