diff --git a/web/app/components/workflow/block-selector/constants.tsx b/web/app/components/workflow/block-selector/constants.tsx
index 589115d4b4..65f1a3f61b 100644
--- a/web/app/components/workflow/block-selector/constants.tsx
+++ b/web/app/components/workflow/block-selector/constants.tsx
@@ -101,7 +101,7 @@ export const BLOCKS: Block[] = [
     title: 'Agent',
   },
   {
-    classification: BlockClassificationEnum.Default,
+    classification: BlockClassificationEnum.Logic,
     type: BlockEnum.HumanInput,
     title: 'Human Input',
   },
diff --git a/web/app/components/workflow/nodes/human-input/default.ts b/web/app/components/workflow/nodes/human-input/default.ts
index a82bc066a2..30f21de9e1 100644
--- a/web/app/components/workflow/nodes/human-input/default.ts
+++ b/web/app/components/workflow/nodes/human-input/default.ts
@@ -1,10 +1,20 @@
 import type { NodeDefault } from '../../types'
 import type { HumanInputNodeType } from './types'
+import { DeliveryMethodType } from './types'
 import { ALL_CHAT_AVAILABLE_BLOCKS } from '@/app/components/workflow/blocks'
 
 const nodeDefault: NodeDefault<HumanInputNodeType> = {
   defaultValue: {
-    deliveryMethod: [],
+    deliveryMethod: [
+      {
+        type: DeliveryMethodType.WebApp,
+        enabled: true,
+      },
+      {
+        type: DeliveryMethodType.Email,
+        enabled: false,
+      },
+    ],
     userActions: [],
   },
   getAvailablePrevNodes(isChatMode: boolean) {
diff --git a/web/app/components/workflow/nodes/human-input/node.tsx b/web/app/components/workflow/nodes/human-input/node.tsx
index 7681df594a..6ab9604879 100644
--- a/web/app/components/workflow/nodes/human-input/node.tsx
+++ b/web/app/components/workflow/nodes/human-input/node.tsx
@@ -1,32 +1,38 @@
 import type { FC } from 'react'
 import React from 'react'
+import {
+  RiMailSendFill,
+  RiRobot2Fill,
+} from '@remixicon/react'
 import type { HumanInputNodeType } from './types'
 import type { NodeProps } from '@/app/components/workflow/types'
-// import { isConversationVar, isENV, isSystemVar } from '@/app/components/workflow/nodes/_base/components/variable/utils'
-import {
-  useIsChatMode,
-  useWorkflow,
-  useWorkflowVariables,
-} from '@/app/components/workflow/hooks'
-// import { VarBlockIcon } from '@/app/components/workflow/block-icon'
-// import { Line3 } from '@/app/components/base/icons/src/public/common'
-// import { Variable02 } from '@/app/components/base/icons/src/vender/solid/development'
-// import { BubbleX, Env } from '@/app/components/base/icons/src/vender/line/others'
-// import { BlockEnum } from '@/app/components/workflow/types'
-// import cn from 'classnames'
+import { DeliveryMethodType } from './types'
 
 const Node: FC<NodeProps<HumanInputNodeType>> = ({
-  id,
   data,
 }) => {
-  const { getBeforeNodesInSameBranch } = useWorkflow()
-  const availableNodes = getBeforeNodesInSameBranch(id)
-  const { getCurrentVariableType } = useWorkflowVariables()
-  const isChatMode = useIsChatMode()
+  const deliveryMethods = data.deliveryMethod || []
 
   return (
-    <div className='mb-1 space-y-0.5 px-3 py-1'>
-      TODO
+    <div className='space-y-0.5 py-1'>
+      <div className='system-2xs-medium-uppercase px-2.5 py-0.5 text-text-tertiary'>delivery method</div>
+      <div className='space-y-0.5 px-2.5'>
+        {deliveryMethods.map(method => (
+          <div key={method.type} className='flex items-center gap-1 rounded-[6px] bg-workflow-block-parma-bg p-1'>
+            {method.type === DeliveryMethodType.WebApp && (
+              <div className='rounded-[4px] border border-divider-regular bg-components-icon-bg-indigo-solid p-0.5'>
+                <RiRobot2Fill className='h-3.5 w-3.5 text-text-primary-on-surface' />
+              </div>
+            )}
+            {method.type === DeliveryMethodType.Email && (
+              <div className='rounded-[4px] border border-divider-regular bg-components-icon-bg-blue-solid p-0.5'>
+                <RiMailSendFill className='h-3.5 w-3.5 text-text-primary-on-surface' />
+              </div>
+            )}
+            <span className='system-xs-regular capitalize text-text-secondary'>{method.type}</span>
+          </div>
+        ))}
+      </div>
     </div>
   )
 }
diff --git a/web/app/components/workflow/nodes/human-input/types.ts b/web/app/components/workflow/nodes/human-input/types.ts
index e846e3ff85..0e06c8509d 100644
--- a/web/app/components/workflow/nodes/human-input/types.ts
+++ b/web/app/components/workflow/nodes/human-input/types.ts
@@ -1,9 +1,39 @@
 import type { CommonNodeType, Variable } from '@/app/components/workflow/types'
 
 export type HumanInputNodeType = CommonNodeType & {
-  deliveryMethod: any[]
+  deliveryMethod: DeliveryMethod[]
   formContent: any
-  userActions: any[]
+  userActions: UserAction[]
   timeout: any
   outputs: Variable[]
 }
+
+export type Timeout = {
+  value: number
+  unit: 'hours' | 'days'
+}
+
+export enum DeliveryMethodType {
+  WebApp = 'webapp',
+  Email = 'email',
+  Slack = 'slack',
+}
+
+export type DeliveryMethod = {
+  type: DeliveryMethodType
+  enabled: boolean
+  configure?: Record<string, any>
+}
+
+export enum UserActionButtonType {
+  Primary = 'primary',
+  Default = 'default',
+  Accent = 'accent',
+  Ghost = 'ghost',
+}
+
+export type UserAction = {
+  name: string
+  text: string
+  type: UserActionButtonType
+}