diff --git a/lib/models/requests/studio.dart b/lib/models/requests/studio.dart
new file mode 100644
index 0000000..74feeaa
--- /dev/null
+++ b/lib/models/requests/studio.dart
@@ -0,0 +1,13 @@
+class StudioRequestArgs {
+  final int page;
+  final String? search;
+  final String? order;
+  final String? type;
+
+  const StudioRequestArgs({
+    required this.page,
+    this.search,
+    this.order,
+    this.type,
+  });
+}
diff --git a/lib/models/srudio_data.dart b/lib/models/srudio_data.dart
new file mode 100644
index 0000000..1e7f4b6
--- /dev/null
+++ b/lib/models/srudio_data.dart
@@ -0,0 +1,37 @@
+class StudioData {
+  final int id;
+  final String title;
+  final String image;
+  final String duration;
+  final String createdAt;
+  bool marked;
+
+  StudioData({
+    required this.id,
+    required this.title,
+    required this.image,
+    required this.duration,
+    required this.createdAt,
+    required this.marked,
+  });
+
+  factory StudioData.fromJson(Map<String, dynamic> json) {
+    return StudioData(
+      id: json['id'],
+      title: json['title'],
+      image: json['image'],
+      duration: json['duration'],
+      createdAt: json['createdAt'],
+      marked: json['marked'],
+    );
+  }
+
+  Map<String, dynamic> toJson() => {
+        'id': id,
+        'title': title,
+        'image': image,
+        'duration': duration,
+        'createdAt': createdAt,
+        'marked': marked,
+      };
+}
diff --git a/lib/views/home/studio/studio.dart b/lib/views/home/studio/studio.dart
index 08c8e37..bf7a141 100644
--- a/lib/views/home/studio/studio.dart
+++ b/lib/views/home/studio/studio.dart
@@ -10,6 +10,7 @@ import 'package:didvan/views/widgets/didvan/divider.dart';
 import 'package:didvan/views/widgets/didvan/icon_button.dart';
 import 'package:didvan/views/widgets/didvan/radial_button.dart';
 import 'package:didvan/views/widgets/item_title.dart';
+import 'package:didvan/views/widgets/state_handlers/sliver_state_handler.dart';
 import 'package:flutter/material.dart';
 import 'package:provider/provider.dart';
 
@@ -23,6 +24,12 @@ class Studio extends StatefulWidget {
 class _StudioState extends State<Studio> {
   final FocusNode _focusNode = FocusNode();
 
+  @override
+  void initState() {
+    context.read<StudioState>().init();
+    super.initState();
+  }
+
   @override
   Widget build(BuildContext context) {
     return CustomScrollView(
@@ -82,6 +89,14 @@ class _StudioState extends State<Studio> {
             ),
           ),
         ),
+        Consumer<StudioState>(
+          builder: (context, state, child) => SliverStateHandler<StudioState>(
+            state: state,
+            builder: (context, state, index) => Container(),
+            childCount: state.studios.length,
+            onRetry: () {},
+          ),
+        ),
       ],
     );
   }
diff --git a/lib/views/home/studio/studio_state.dart b/lib/views/home/studio/studio_state.dart
index 28ebd1e..0008b17 100644
--- a/lib/views/home/studio/studio_state.dart
+++ b/lib/views/home/studio/studio_state.dart
@@ -1,7 +1,73 @@
+import 'package:didvan/models/enums.dart';
+import 'package:didvan/models/requests/studio.dart';
+import 'package:didvan/models/srudio_data.dart';
 import 'package:didvan/providers/core_provider.dart';
+import 'package:didvan/services/network/request.dart';
+import 'package:didvan/services/network/request_helper.dart';
 
 class StudioState extends CoreProvier {
+  final List<StudioData> studios = [];
+
+  String? search;
+  String? lastSearch;
+  int page = 1;
+  int lastPage = 1;
+
   int selectedSortTypeIndex = 0;
 
-  bool videosSelected = true;
+  bool _videosSelected = true;
+
+  bool get videosSelected => _videosSelected;
+
+  set videosSelected(bool value) {
+    if (_videosSelected == value) return;
+    _videosSelected = value;
+    getStudioOverviews(page: page);
+  }
+
+  void init() {
+    search = '';
+    lastSearch = '';
+    videosSelected = true;
+    selectedSortTypeIndex = 0;
+    Future.delayed(Duration.zero, () {
+      getStudioOverviews(page: 1);
+    });
+  }
+
+  String get _order {
+    if (selectedSortTypeIndex == 0) return 'date';
+    if (selectedSortTypeIndex == 1) return 'view';
+    return 'comment';
+  }
+
+  Future<void> getStudioOverviews({required int page}) async {
+    this.page = page;
+    if (page == 1) {
+      appState = AppState.busy;
+    }
+
+    final service = RequestService(
+      RequestHelper.studioItemOverviews(
+        args: StudioRequestArgs(
+          page: page,
+          type: videosSelected ? 'video' : 'podcast',
+          search: search,
+          order: _order,
+        ),
+      ),
+    );
+
+    await service.httpGet();
+    if (service.isSuccess) {
+      lastPage = service.result['lastPage'];
+      final studioItems = service.result['studios'];
+      for (var i = 0; i < studioItems.length; i++) {
+        studios.add(StudioData.fromJson(studioItems[i]));
+      }
+      appState = AppState.idle;
+      return;
+    }
+    appState = AppState.failed;
+  }
 }
diff --git a/lib/views/home/studio/video_details/video_details.dart b/lib/views/home/studio/video_details/video_details.dart
index e69de29..8b13789 100644
--- a/lib/views/home/studio/video_details/video_details.dart
+++ b/lib/views/home/studio/video_details/video_details.dart
@@ -0,0 +1 @@
+
diff --git a/lib/views/home/studio/widgets/tab_bar.dart b/lib/views/home/studio/widgets/tab_bar.dart
index 7e11744..3d915a8 100644
--- a/lib/views/home/studio/widgets/tab_bar.dart
+++ b/lib/views/home/studio/widgets/tab_bar.dart
@@ -14,14 +14,15 @@ class StudioTabBar extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     final state = context.watch<StudioState>();
-    return Container(
+    return AnimatedContainer(
+      duration: DesignConfig.lowAnimationDuration,
       margin: const EdgeInsets.symmetric(horizontal: 16),
       padding: const EdgeInsets.all(4),
       decoration: BoxDecoration(
         border: Border.all(
           color: state.videosSelected
               ? Theme.of(context).colorScheme.secondary
-              : Theme.of(context).primaryColor,
+              : Theme.of(context).colorScheme.primary,
         ),
         borderRadius: DesignConfig.lowBorderRadius,
       ),
@@ -32,7 +33,7 @@ class StudioTabBar extends StatelessWidget {
               icon: DidvanIcons.video_solid,
               selectedColor: Theme.of(context).colorScheme.secondary,
               title: 'ویدئو',
-              onTap: () {},
+              onTap: () => state.videosSelected = true,
               isSelected: state.videosSelected,
             ),
           ),
@@ -46,7 +47,7 @@ class StudioTabBar extends StatelessWidget {
               icon: DidvanIcons.podcast_solid,
               selectedColor: Theme.of(context).colorScheme.focusedBorder,
               title: 'پادکست',
-              onTap: () {},
+              onTap: () => state.videosSelected = false,
               isSelected: !state.videosSelected,
             ),
           ),