diff --git a/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/components/CTASummary.tsx b/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/components/CTASummary.tsx
index 76dd63b118..e2951b202a 100644
--- a/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/components/CTASummary.tsx
+++ b/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/components/CTASummary.tsx
@@ -1,3 +1,5 @@
+import { InboxIcon } from "lucide-react";
+
 import { TSurveyQuestionSummaryCta } from "@formbricks/types/surveys";
 import { ProgressBar } from "@formbricks/ui/ProgressBar";
 
@@ -10,12 +12,33 @@ interface CTASummaryProps {
 
 export const CTASummary = ({ questionSummary }: CTASummaryProps) => {
   return (
-    <div className=" rounded-lg border border-slate-200 bg-slate-50 shadow-sm">
-      <QuestionSummaryHeader questionSummary={questionSummary} />
+    <div className="rounded-lg border border-slate-200 bg-slate-50 shadow-sm">
+      <QuestionSummaryHeader
+        questionSummary={questionSummary}
+        showResponses={false}
+        insights={
+          <>
+            <div className="flex items-center rounded-lg bg-slate-100 p-2">
+              <InboxIcon className="mr-2 h-4 w-4" />
+              {`${questionSummary.impressionCount} Impressions`}
+            </div>
+            <div className="flex items-center rounded-lg bg-slate-100 p-2">
+              <InboxIcon className="mr-2 h-4 w-4" />
+              {`${questionSummary.clickCount} Clicks`}
+            </div>
+            {!questionSummary.question.required && (
+              <div className="flex items-center rounded-lg bg-slate-100 p-2">
+                <InboxIcon className="mr-2 h-4 w-4" />
+                {`${questionSummary.skipCount} Skips`}
+              </div>
+            )}
+          </>
+        }
+      />
       <div className="space-y-5 rounded-b-lg bg-white px-4 pb-6 pt-4 text-sm md:px-6 md:text-base">
         <div className="text flex justify-between px-2 pb-2">
           <div className="mr-8 flex space-x-1">
-            <p className="font-semibold text-slate-700">Click-through rate (CTR)</p>
+            <p className="font-semibold text-slate-700">CTR</p>
             <div>
               <p className="rounded-lg bg-slate-100 px-2 text-slate-700">
                 {convertFloatToNDecimal(questionSummary.ctr.percentage, 1)}%
@@ -23,7 +46,7 @@ export const CTASummary = ({ questionSummary }: CTASummaryProps) => {
             </div>
           </div>
           <p className="flex w-32 items-end justify-end text-slate-600">
-            {questionSummary.ctr.count} {questionSummary.ctr.count === 1 ? "click" : "clicks"}
+            {questionSummary.ctr.count} {questionSummary.ctr.count === 1 ? "Click" : "Clicks"}
           </p>
         </div>
         <ProgressBar barColor="bg-brand" progress={questionSummary.ctr.percentage / 100} />
diff --git a/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/components/QuestionSummaryHeader.tsx b/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/components/QuestionSummaryHeader.tsx
index 4c974080fe..12316b7b1d 100644
--- a/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/components/QuestionSummaryHeader.tsx
+++ b/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/components/QuestionSummaryHeader.tsx
@@ -6,9 +6,11 @@ import { TSurveyQuestionSummary } from "@formbricks/types/surveys";
 
 interface HeadProps {
   questionSummary: TSurveyQuestionSummary;
+  showResponses?: boolean;
+  insights?: JSX.Element;
 }
 
-export const QuestionSummaryHeader = ({ questionSummary }: HeadProps) => {
+export const QuestionSummaryHeader = ({ questionSummary, insights, showResponses = true }: HeadProps) => {
   const questionType = questionTypes.find((type) => type.id === questionSummary.question.type);
 
   return (
@@ -23,10 +25,13 @@ export const QuestionSummaryHeader = ({ questionSummary }: HeadProps) => {
           {questionType && <questionType.icon className="mr-2 h-4 w-4 " />}
           {questionType ? questionType.label : "Unknown Question Type"} Question
         </div>
-        <div className=" flex items-center rounded-lg bg-slate-100 p-2">
-          <InboxIcon className="mr-2 h-4 w-4" />
-          {`${questionSummary.responseCount} Responses`}
-        </div>
+        {showResponses && (
+          <div className=" flex items-center rounded-lg bg-slate-100 p-2">
+            <InboxIcon className="mr-2 h-4 w-4" />
+            {`${questionSummary.responseCount} Responses`}
+          </div>
+        )}
+        {insights}
         {!questionSummary.question.required && (
           <div className="flex items-center  rounded-lg bg-slate-100 p-2">Optional</div>
         )}
diff --git a/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/components/SummaryDropOffs.tsx b/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/components/SummaryDropOffs.tsx
index 76c2c94636..959eb7cb46 100644
--- a/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/components/SummaryDropOffs.tsx
+++ b/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/components/SummaryDropOffs.tsx
@@ -25,8 +25,8 @@ export const SummaryDropOffs = ({ dropOff }: SummaryDropOffsProps) => {
               </Tooltip>
             </TooltipProvider>
           </div>
-          <div className="px-4 text-center md:px-6">Views</div>
-          <div className="pr-6 text-center md:pl-6">Drop Offs</div>
+          <div className="px-4 text-center md:px-6">Impressions</div>
+          <div className="pr-6 text-center md:pl-6">Drop-Offs</div>
         </div>
         {dropOff.map((quesDropOff) => (
           <div
@@ -36,9 +36,9 @@ export const SummaryDropOffs = ({ dropOff }: SummaryDropOffsProps) => {
             <div className="whitespace-pre-wrap text-center font-semibold">
               {quesDropOff.ttc > 0 ? (quesDropOff.ttc / 1000).toFixed(2) + "s" : "N/A"}
             </div>
-            <div className="whitespace-pre-wrap text-center font-semibold">{quesDropOff.views}</div>
+            <div className="whitespace-pre-wrap text-center font-semibold">{quesDropOff.impressions}</div>
             <div className=" pl-6 text-center md:px-6">
-              <span className="font-semibold">{quesDropOff.dropOffCount}</span>
+              <span className="mr-1.5 font-semibold">{quesDropOff.dropOffCount}</span>
               <span>({Math.round(quesDropOff.dropOffPercentage)}%)</span>
             </div>
           </div>
diff --git a/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/components/SummaryMetadata.tsx b/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/components/SummaryMetadata.tsx
index 748c661190..31fc0edfc9 100644
--- a/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/components/SummaryMetadata.tsx
+++ b/apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/(analysis)/summary/components/SummaryMetadata.tsx
@@ -1,8 +1,7 @@
 import { ChevronDownIcon, ChevronUpIcon } from "lucide-react";
 
 import { timeSinceConditionally } from "@formbricks/lib/time";
-import { TSurveySummary } from "@formbricks/types/surveys";
-import { TSurvey } from "@formbricks/types/surveys";
+import { TSurvey, TSurveySummary } from "@formbricks/types/surveys";
 import { Button } from "@formbricks/ui/Button";
 import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@formbricks/ui/Tooltip";
 
@@ -71,7 +70,7 @@ export const SummaryMetadata = ({
       <div className="flex flex-col-reverse gap-y-2 lg:grid lg:grid-cols-3 lg:gap-x-2">
         <div className="grid grid-cols-2 gap-4 md:grid-cols-5 md:gap-x-2 lg:col-span-2">
           <StatCard
-            label="Displays"
+            label="Impressions"
             percentage={null}
             value={displayCount === 0 ? <span>-</span> : displayCount}
             tooltipText="Number of times the survey has been viewed."
@@ -89,7 +88,7 @@ export const SummaryMetadata = ({
             tooltipText="Number of times the survey has been completed."
           />
           <StatCard
-            label="Drop Offs"
+            label="Drop-Offs"
             percentage={`${Math.round(dropOffPercentage)}%`}
             value={dropOffCount === 0 ? <span>-</span> : dropOffCount}
             tooltipText="Number of times the survey has been started but not completed."
@@ -110,7 +109,7 @@ export const SummaryMetadata = ({
             className="w-max self-start"
             EndIcon={showDropOffs ? ChevronDownIcon : ChevronUpIcon}
             onClick={() => setShowDropOffs(!showDropOffs)}>
-            Analyze Drop Offs
+            Analyze Drop-Offs
           </Button>
         </div>
       </div>
diff --git a/apps/web/playwright/js.spec.ts b/apps/web/playwright/js.spec.ts
index e60c240b61..c85642244e 100644
--- a/apps/web/playwright/js.spec.ts
+++ b/apps/web/playwright/js.spec.ts
@@ -117,13 +117,13 @@ test.describe("JS Package Test", async () => {
 
     // Survey should have 2 Displays
     await page.waitForTimeout(1000);
-    await expect(page.getByText("Displays2")).toBeVisible();
+    await expect(page.getByText("Impressions2")).toBeVisible();
 
     // Survey should have 1 Response
     await page.waitForTimeout(1000);
     await expect(page.getByRole("button", { name: "Responses50%" })).toBeVisible();
     await expect(page.getByText("1 Responses", { exact: true }).first()).toBeVisible();
-    await expect(page.getByText("Click-through rate (CTR)100%")).toBeVisible();
+    await expect(page.getByText("CTR50%")).toBeVisible();
     await expect(page.getByText("Somewhat disappointed100%")).toBeVisible();
     await expect(page.getByText("Founder100%")).toBeVisible();
     await expect(page.getByText("People who believe that PMF").first()).toBeVisible();
diff --git a/packages/lib/response/service.ts b/packages/lib/response/service.ts
index 72ec2d78a2..dc09a917ba 100644
--- a/packages/lib/response/service.ts
+++ b/packages/lib/response/service.ts
@@ -230,7 +230,17 @@ export const createResponse = async (responseInput: TResponseInput): Promise<TRe
   validateInputs([responseInput, ZResponseInput]);
   captureTelemetry("response created");
 
-  const { environmentId, language, userId, surveyId, finished, data, meta, singleUseId } = responseInput;
+  const {
+    environmentId,
+    language,
+    userId,
+    surveyId,
+    finished,
+    data,
+    meta,
+    singleUseId,
+    ttc: initialTtc,
+  } = responseInput;
   try {
     let person: TPerson | null = null;
 
@@ -242,6 +252,8 @@ export const createResponse = async (responseInput: TResponseInput): Promise<TRe
       }
     }
 
+    const ttc = initialTtc ? (finished ? calculateTtcTotal(initialTtc) : initialTtc) : {};
+
     const responsePrisma = await prisma.response.create({
       data: {
         survey: {
@@ -262,6 +274,7 @@ export const createResponse = async (responseInput: TResponseInput): Promise<TRe
         }),
         ...(meta && ({ meta } as Prisma.JsonObject)),
         singleUseId,
+        ttc: ttc,
       },
       select: responseSelection,
     });
@@ -615,11 +628,12 @@ export const getSurveySummary = (
           createdAt: filterCriteria?.createdAt,
         });
 
-        const meta = getSurveySummaryMeta(responses, displayCount);
         const dropOff = getSurveySummaryDropOff(survey, responses, displayCount);
+        const meta = getSurveySummaryMeta(responses, displayCount);
         const questionWiseSummary = getQuestionWiseSummary(
           checkForRecallInHeadline(survey, "default"),
-          responses
+          responses,
+          dropOff
         );
 
         return { meta, dropOff, summary: questionWiseSummary };
diff --git a/packages/lib/response/tests/__mocks__/data.mock.ts b/packages/lib/response/tests/__mocks__/data.mock.ts
index 8e0be990bd..c0d7e95483 100644
--- a/packages/lib/response/tests/__mocks__/data.mock.ts
+++ b/packages/lib/response/tests/__mocks__/data.mock.ts
@@ -7,9 +7,8 @@ import {
   TResponseFilterCriteria,
   TResponseUpdateInput,
   TSurveyPersonAttributes,
-  TSurveySummary,
 } from "@formbricks/types/responses";
-import { TSurveyQuestionType } from "@formbricks/types/surveys";
+import { TSurveyQuestionType, TSurveySummary } from "@formbricks/types/surveys";
 import { TTag } from "@formbricks/types/tags";
 
 import { transformPrismaPerson } from "../../../person/service";
@@ -480,7 +479,7 @@ export const mockSurveySummaryOutput: TSurveySummary = {
       headline: "Question Text",
       questionId: "ars2tjk8hsi8oqk1uac00mo8",
       ttc: 0,
-      views: 0,
+      impressions: 0,
     },
   ],
   meta: {
diff --git a/packages/lib/response/util.ts b/packages/lib/response/util.ts
index 8e32d03162..f67614ce0b 100644
--- a/packages/lib/response/util.ts
+++ b/packages/lib/response/util.ts
@@ -526,7 +526,7 @@ export const getSurveySummaryDropOff = (
   let responseCounts = { ...initialTtc };
 
   let dropOffArr = new Array(survey.questions.length).fill(0) as number[];
-  let viewsArr = new Array(survey.questions.length).fill(0) as number[];
+  let impressionsArr = new Array(survey.questions.length).fill(0) as number[];
   let dropOffPercentageArr = new Array(survey.questions.length).fill(0) as number[];
 
   responses.forEach((response) => {
@@ -546,7 +546,7 @@ export const getSurveySummaryDropOff = (
 
       if (!currQues.required) {
         if (!response.data[currQues.id]) {
-          viewsArr[currQuesIdx]++;
+          impressionsArr[currQuesIdx]++;
 
           if (currQuesIdx === survey.questions.length - 1 && !response.finished) {
             dropOffArr[currQuesIdx]++;
@@ -577,11 +577,11 @@ export const getSurveySummaryDropOff = (
         (currQues.required && !response.data[currQues.id])
       ) {
         dropOffArr[currQuesIdx]++;
-        viewsArr[currQuesIdx]++;
+        impressionsArr[currQuesIdx]++;
         break;
       }
 
-      viewsArr[currQuesIdx]++;
+      impressionsArr[currQuesIdx]++;
 
       let nextQuesIdx = currQuesIdx + 1;
       const questionHasCustomLogic = currQues.logic;
@@ -598,7 +598,7 @@ export const getSurveySummaryDropOff = (
 
       if (!response.data[survey.questions[nextQuesIdx]?.id] && !response.finished) {
         dropOffArr[nextQuesIdx]++;
-        viewsArr[nextQuesIdx]++;
+        impressionsArr[nextQuesIdx]++;
         break;
       }
 
@@ -613,20 +613,22 @@ export const getSurveySummaryDropOff = (
   });
 
   if (!survey.welcomeCard.enabled) {
-    dropOffArr[0] = displayCount - viewsArr[0];
-    if (viewsArr[0] > displayCount) dropOffPercentageArr[0] = 0;
+    dropOffArr[0] = displayCount - impressionsArr[0];
+    if (impressionsArr[0] > displayCount) dropOffPercentageArr[0] = 0;
 
     dropOffPercentageArr[0] =
-      viewsArr[0] - displayCount >= 0 ? 0 : ((displayCount - viewsArr[0]) / displayCount) * 100 || 0;
+      impressionsArr[0] - displayCount >= 0
+        ? 0
+        : ((displayCount - impressionsArr[0]) / displayCount) * 100 || 0;
 
-    viewsArr[0] = displayCount;
+    impressionsArr[0] = displayCount;
   } else {
-    dropOffPercentageArr[0] = (dropOffArr[0] / viewsArr[0]) * 100;
+    dropOffPercentageArr[0] = (dropOffArr[0] / impressionsArr[0]) * 100;
   }
 
   for (let i = 1; i < survey.questions.length; i++) {
-    if (viewsArr[i] !== 0) {
-      dropOffPercentageArr[i] = (dropOffArr[i] / viewsArr[i]) * 100;
+    if (impressionsArr[i] !== 0) {
+      dropOffPercentageArr[i] = (dropOffArr[i] / impressionsArr[i]) * 100;
     }
   }
 
@@ -635,7 +637,7 @@ export const getSurveySummaryDropOff = (
       questionId: question.id,
       headline: getLocalizedValue(question.headline, "default"),
       ttc: convertFloatTo2Decimal(totalTtc[question.id]) || 0,
-      views: viewsArr[index] || 0,
+      impressions: impressionsArr[index] || 0,
       dropOffCount: dropOffArr[index] || 0,
       dropOffPercentage: convertFloatTo2Decimal(dropOffPercentageArr[index]) || 0,
     };
@@ -683,12 +685,13 @@ const checkForI18n = (response: TResponse, id: string, survey: TSurvey, language
 
 export const getQuestionWiseSummary = (
   survey: TSurvey,
-  responses: TResponse[]
+  responses: TResponse[],
+  dropOff: TSurveySummary["dropOff"]
 ): TSurveySummary["summary"] => {
   const VALUES_LIMIT = 50;
   let summary: TSurveySummary["summary"] = [];
 
-  survey.questions.forEach((question) => {
+  survey.questions.forEach((question, idx) => {
     switch (question.type) {
       case TSurveyQuestionType.OpenText: {
         let values: TSurveyQuestionSummaryOpenText["samples"] = [];
@@ -957,15 +960,18 @@ export const getQuestionWiseSummary = (
         });
 
         const totalResponses = data.clicked + data.dismissed;
+        const impressions = dropOff[idx].impressions;
 
         summary.push({
           type: question.type,
           question,
+          impressionCount: impressions,
+          clickCount: data.clicked,
+          skipCount: data.dismissed,
           responseCount: totalResponses,
           ctr: {
             count: data.clicked,
-            percentage:
-              totalResponses > 0 ? convertFloatTo2Decimal((data.clicked / totalResponses) * 100) : 0,
+            percentage: impressions > 0 ? convertFloatTo2Decimal((data.clicked / impressions) * 100) : 0,
           },
         });
         break;
diff --git a/packages/types/surveys.ts b/packages/types/surveys.ts
index 07d94c7ad1..30f42b5ec1 100644
--- a/packages/types/surveys.ts
+++ b/packages/types/surveys.ts
@@ -679,6 +679,9 @@ export type TSurveyQuestionSummaryNps = z.infer<typeof ZSurveyQuestionSummaryNps
 export const ZSurveyQuestionSummaryCta = z.object({
   type: z.literal("cta"),
   question: ZSurveyCTAQuestion,
+  impressionCount: z.number(),
+  clickCount: z.number(),
+  skipCount: z.number(),
   responseCount: z.number(),
   ctr: z.object({
     count: z.number(),
@@ -832,7 +835,7 @@ export const ZSurveySummary = z.object({
       questionId: z.string().cuid2(),
       headline: z.string(),
       ttc: z.number(),
-      views: z.number(),
+      impressions: z.number(),
       dropOffCount: z.number(),
       dropOffPercentage: z.number(),
     })