Loy's portfolio

Overview

CiteMe is a groundbreaking academic productivity tool designed to empower researchers, students, and professionals by leveraging AI capabilities. This platform integrates citation management, academic writing assistance, and project organization into a cohesive, user-friendly experience. With CiteMe, users can enhance the quality of their academic output while saving time and ensuring consistency.

Problem and Solution

Problem Statement

Academic writing is often hindered by manual citation errors, fragmented workflows, and inefficiencies in drafting coherent, plagiarism-free content. Despite existing tools, many users struggle to streamline their writing process without compromising quality or integrity.

Challenges Identified:

Time-consuming Citation Management: Formatting citations across different styles was error-prone and inefficient.
Language & Style Enhancements: Users lacked tools tailored for academic tone, grammar, and structure.

Plagiarism Concerns: Existing tools provided limited feedback on originality and plagiarism detection.

‍

‍Solution

CiteMe bridges these gaps by providing an all-in-one platform that combines advanced AI-powered writing assistance, automated citation management, and user-centric project organization. The design emphasizes usability, accessibility, and integration with popular academic platforms like Google Scholar, Scopus, and Medium.

‍

Research and Insights

Phase 1: Research & Discovery

User Research

To understand the challenges faced by our target audience, we conducted qualitative and quantitative research with over 100 participants, including professors, PhD candidates, and undergraduate students.

Methods Used:

Surveys: Distributed to a global academic audience to identify prevalent pain points in academic writing.
In-depth Interviews: Conducted with 20 users to understand their workflows and frustrations.
Contextual Inquiry: Observed users in real-time as they managed citations and drafted content to uncover hidden pain points.

Key Findings:

68% of users reported frustration with managing citations across different styles.
72% desired a unified tool to combine citation, language enhancement, and plagiarism detection.
55% felt existing tools were overly complex or lacked the necessary features.

Competitive Analysis

A benchmark study of tools such as Zotero, Grammarly, and Mendeley revealed:

Strengths: Rich functionality but limited in usability.
Weaknesses: Fragmented workflows and steep learning curves.
Opportunities: Seamless integration and simplified UI to create a holistic tool.

Market Gaps Identified

Lack of tools that integrate multiple academic writing functions.
Inadequate support for collaboration and project tracking.

‍

Design Process

‍Phase 2: Ideation & Persona Development

Personas

Undergraduate Student: Struggles with citations and grammar but values simplicity.
Doctoral Candidate: Requires advanced tools for thesis writing and citation management.
Professor: Needs quick, reliable tools for assessing academic integrity in submissions.

‍

User Journey Mapping

We mapped the user journey from onboarding to completing a project. Friction points included:

Complicated onboarding processes.
Lack of real-time citation corrections.
Absence of integrated tools leading to switching between platforms.

‍

High-Fidelity Prototyping

Overview of Key Pages and Their Features

Dashboard

Purpose: The central hub where users access all their projects and analytics at a glance.
Features:some text
- Project Overview Cards: Provide a snapshot of active and completed projects with status indicators.
- Citation Analytics: Display detailed metrics such as the number of citations added and formatting compliance rates.
- Quick Actions: Includes buttons for starting new projects, importing citations, and accessing integrations.
Design Considerations:some text
- A minimalist layout to reduce cognitive load.
- Color-coded statuses (e.g., green for completed projects, yellow for in-progress).

Writing Workspace

Purpose: The core area for drafting academic content, integrating tools for grammar checking and citations.
Features:some text
- Integrated Text Editor: Allows seamless switching between writing and citation insertion.
- Real-Time Grammar Suggestions: Powered by AI, providing instant corrections and style recommendations.
- Plagiarism Detection Sidebar: Highlights areas of concern with suggestions for rephrasing or citing properly.
Design Considerations:some text
- Intuitive toolbar placement for frequently used actions (e.g., bold, italics, citation insertion).
- Dual-pane layout to compare text and suggested improvements side-by-side.

Citation Manager

Purpose: Simplifies the process of managing and formatting citations.
Features:some text
- Database Integration: Direct imports from Google Scholar, Scopus, and ResearchGate.
- Auto-Formatting: Supports major styles (APA, MLA, Chicago) with real-time previews.
- Error Notifications: Alerts users to incomplete or incorrect citations.
Design Considerations:some text
- Collapsible sections for different citation types (e.g., books, articles).
- A search bar for quick access to specific references.

Plagiarism Checker

Purpose: Ensures academic integrity by identifying potential plagiarism.
Features:some text
- Originality Score: Provides a percentage-based evaluation of unique content.
- Detailed Feedback: Highlights problematic areas with explanations and suggested fixes.
- Source Comparison: Links to original sources for context and verification.
Design Considerations:some text
- Visual heatmaps to indicate severity of issues.
- Exportable reports for academic review or submission.

Settings & Integrations Page

Purpose: Allows users to customize their experience and integrate third-party tools.
Features:some text
- Profile Customization: Adjust default citation styles, themes, and notification preferences.
- Integration Management: Connect or disconnect tools like Google Scholar and Medium.
- Data Export Options: Support for formats such as .csv and .docx.
Design Considerations:some text
- Clear toggle switches for enabling/disabling features.
- Inline help icons for explaining less intuitive settings.

Expanded High-Fidelity Design Highlights

Visual Consistency

Unified color scheme (academic blue with neutral tones) across all pages to enhance professional appeal.
Font pairing optimized for readability: headers use a bold sans-serif font, while body text utilizes a clean serif font for a scholarly touch.

Accessibility Features

Keyboard navigability and focus indicators for improved usability.
WCAG-compliant color contrasts and text sizes.

Microinteractions

Subtle animations for hover states, button clicks, and loading indicators.
Tooltips that appear contextually to guide users during complex actions.

‍

Phase 3: Design & Prototyping

MockUp

Interactive prototype

Check interactive prototype here

Testing & Refinements for Key Pages

‍Dashboard Feedback

Users appreciated the clean layout but requested additional customization options for the project cards.
Action Taken: Added drag-and-drop functionality to rearrange projects and configurable widgets.

Writing Workspace Improvements

Initial tests revealed confusion about the AI suggestions panel placement.
Action Taken: Relocated the panel to the right side with a collapsible option for smaller screens.

Citation Manager Updates

Users highlighted the need for a bulk-editing feature.
Action Taken: Introduced multi-select functionality to update or delete multiple citations simultaneously.

‍

Reflections and Takeaways

Iterative Feedback is Key: Regular user testing refined the design and functionality.
Balancing Simplicity with Functionality: Complex tools can be accessible with thoughtful design.‍‍
‍Future-Ready Platforms: Scalability and integration should be considered from the outset.

CiteMe