Skip to main content

Quickstart Guide

This guide walks you through logging into Biométrico and completing your first student photo registration. By the end, you’ll understand the complete workflow from authentication to HikCentral synchronization.

Prerequisites

  • Valid user credentials from the IT Department (Dirección de TIC)
  • One of the authorized roles: sotics, atics, or sa
  • Student ID (cédula) for registration
  • Active internet connection to access SIAD and HikCentral APIs

Step 1: Login to the System

1

Access the Login Page

Navigate to the Biométrico application. You’ll see the Sistema Acceso Facial login screen with the UTLVTE logo.The login form includes:
  • Username field (institutional credentials)
  • Password field with visibility toggle
  • “Ingresar” (Enter) button
2

Enter Your Credentials

Input your username and password provided by the IT Department.
// The system validates credentials against these roles
const validRoles = ['sotics', 'atics', 'sa'];
If you don’t have credentials, contact the Dirección de TIC. The system only accepts users with pre-approved roles.
3

Submit and Authenticate

Click Ingresar to submit your credentials. The system will:
  1. Send credentials to the authentication endpoint
  2. Receive a Bearer token and user role
  3. Store authentication data in localStorage
  4. Redirect to the home dashboard
// Authentication response structure
{
  token: "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9...",
  token_type: "Bearer",
  Role: "sotics",
  name: "Juan Pérez",
  email: "[email protected]"
}

Step 2: Navigate to Student Registration

After successful login, you’ll access the main dashboard.
1

Access Registration Module

Navigate to EstudiantesRegistro Individual in the sidebar menu.This corresponds to the route:
{
  path: '/estudiantes_registro',
  name: 'EstudianteR',
  component: Registro_IndvEst
}
2

Select Academic Period

Choose the active academic period (Periodo Lectivo) from the radio button options.The system displays available periods from the database, such as:
  • 2024-2025 Ciclo 1
  • 2024-2025 Ciclo 2
  • 2025-2026 Ciclo 1

Step 3: Search for a Student

1

Enter Student ID

In the search field, type the student’s identification number (cédula).
<input 
  type="text" 
  placeholder="Ingresa la cédula a buscar..."
  v-model="searchQuery"
  @input="debouncedFilter"
  @keypress="onlyNumbers"
  @keyup.enter="buscarEstudiante"
/>
The search field only accepts numeric input. Press Enter to search or use the debounced auto-search.
2

Review Student Information

Once found, the system displays two information panels:Personal Information (from SIAD):
  • Full name (Nombres, Apellidos)
  • Institutional email
  • Academic program (Carrera)
  • Student photo from SIAD
HikCentral Information:
  • Current registration status
  • Existing photo in HikCentral (if registered)
  • Comparison view (SIAD photo vs HikCentral photo)

Step 4: Compare and Verify Photos

The registration interface shows a side-by-side photo comparison:
<div class="flex justify-center">
  <!-- SIAD Photo -->
  <div class="relative">
    <img :src="getPhotoUrl(estudianteData.CIInfPer)" 
         class="h-32 w-48 rounded-xl object-cover" />
    <span class="badge bg-brand-500">SIAD</span>
  </div>
  
  <!-- HikCentral Photo -->
  <div class="relative">
    <img :src="getPhotoUrl2(estudianteData.CIInfPer)"
         class="h-32 w-48 rounded-xl object-cover" />
    <span class="badge bg-red-500">HIKCENTRAL</span>
  </div>
</div>
1

Verify Photo Quality

Check that the SIAD photo is:
  • Clear and well-lit
  • Shows the student’s full face
  • Recent and recognizable
  • Suitable for facial recognition
2

Check Registration Status

The system displays a status badge:
  • REGISTRADO - Already in HikCentral
  • NO REGISTRADO - Needs synchronization
<span 
  v-else
  :class="estaRegistrado ? 'bg-green-100 text-green-700' : 'bg-red-100 text-red-700'"
  class="px-2 py-1 rounded-md text-xs font-bold uppercase"
>
  {{ estaRegistrado ? 'Registrado' : 'No Registrado' }}
</span>

Step 5: Synchronize with HikCentral

1

Verify All Information

Before synchronizing, confirm:
  • Student name is correct
  • Institutional email is valid
  • Photo is appropriate
  • Academic program matches enrollment
Data sent to HikCentral cannot be easily modified. Double-check all information before synchronizing.
2

Click Sincronizar HK

Press the Sincronizar HK button to push the student data to HikCentral.The synchronization process:
  1. Validates student data completeness
  2. Sends photo and metadata to HikCentral API
  3. Creates or updates the biometric profile
  4. Returns confirmation status
The system shows “Verificando en HikCentral…” while processing. Wait for the operation to complete.
3

Confirm Success

After successful synchronization:
  • Status badge changes to “REGISTRADO”
  • HikCentral photo appears in the comparison view
  • Student can now use facial recognition for access

Complete Workflow Example

Here’s a complete example of registering a student:
// 1. User logs in
const loginData = {
  email: "[email protected]",
  password: "secure_password"
};

const response = await axios.post(
  `${API_URL}/biometrico/login`,
  loginData
);

// 2. Store authentication
localStorage.setItem('token_bio', response.data.token);
localStorage.setItem('token_type_bio', 'Bearer');
localStorage.setItem('user_bio', JSON.stringify(response.data));

// 3. Redirect to dashboard
router.push('/home');

Next Steps

Faculty Registration

Learn how to register teachers and staff members

Batch Operations

Process multiple registrations simultaneously

Reports & Analytics

View registration statistics and system usage

Troubleshooting

Common issues and solutions

Tips for Success

  • Ensure good lighting conditions
  • Student should face camera directly
  • Remove glasses if they cause glare
  • Maintain neutral facial expression
  • Update photos if student appearance changes significantly
If synchronization fails:
  1. Verify student data is complete
  2. Check photo file is accessible
  3. Confirm HikCentral API is responsive
  4. Review error messages in browser console
  5. Contact IT support if issues persist
  • Always select the correct academic period before searching
  • Students may appear in multiple periods
  • Registration persists across periods in HikCentral
  • Update photos when starting new academic years
Congratulations! You’ve completed your first student registration in Biométrico. The student can now use facial recognition to access campus facilities.

Build docs developers (and LLMs) love