Product specification development process

Development preparation

Understand product and design

Participate in requirements, interaction, and vision meetings to understand product design and project members.

Understand the devices and platforms the product is designed for.

Understand the product’s compatibility requirements and whether to adopt responsive design, etc.

Understand the technologies used in products (WEB technology, desktop technology, APP technology, template language, mixed mode, etc.).

Ask questions and insights

Ask questions and insights in an interactive or visual session in conjunction with technical requirements.

Raise possible problems (technical implementation issues, performance issues, etc.), negotiate solutions (such as graceful degradation) and reach consensus.

Propose possible application scenarios of existing new technologies in products to assist product innovation.

Technical research and training

Whether technical research is needed and propose possible risks.

Conduct technical research, produce technical demos, display demos, and provide feedback on research results.

You can first consult an experienced front-end engineer or front-end technology team for technical research content.

Inexperienced or new employees can apply for training.

You can submit difficult technical problems to NEC, and NEC will help you solve the problem.

Understand NEC, especially code specifications and technical demos.

Budget manpower and time

Budget manpower and time based on project time requirements and workload.

Budget development cycle and phased outputs.

Remind the requesting party to create a project in the project management platform and add project members, create SVN and set member permissions.

Development process

Responsibilities and tasks

Determine a page engineer person in charge, who will be responsible for overall planning, distribution and coordination of the entire page development work and other management work and main development responsibilities.

Confirm that the interaction prototype or visual effects have been finalized before starting development work.

If parallel mode is adopted (visual design and page development are carried out at the same time), the interactive prototype will be finalized (when the visual effects are finalized, the page engineer will add details) and the allocation will begin.

Assigned by page type, pages of the same type are assigned to the same person.

Everyone needs to understand the common elements of the page (the same or similar parts in multiple pages). A common element is only assigned to one person. Each person completes the "extraction and stripping" while completing their own page. You may need to understand the "classification method" specification".

Since pictures cannot be merged and conflicts resolved using SVN, the cut pictures need to be allocated as a whole.

Create subdivided development tasks in the project management platform, fill in the task details and time, and if there is a relationship between tasks, set the association or affiliation.

Page development

Create a front-end directory, including the "page development" directory (such as: js, css, html, img) and the "extraction and stripping" directory (such as: demo).

Use NEC framework to create front-end files, such as: css/*.css, html/*.html, demo/grid.html, demo/module.html, demo/unit.html.

Use NEC code library and plug-ins to develop pages efficiently.

Maintain good communication with interaction, visual and other front-end engineers or back-end engineers.

Prompt feedback on questions and suggestions: confirmation of effect doubts, supplementation of missing status, suggestions for graceful degradation, explanation of behavior structure, etc.

If parallel mode is adopted (page development and JS development are carried out at the same time), the interactive prototype will be finalized. JS development engineers can develop the business logic layer in parallel, and then embed the UI layer after the page development is completed.

Extraction and stripping

Extract layout (grid), module (module), and component (unit) to the corresponding HTML file while developing the page.

Avoid duplication of work and have a clear view of page elements. When adding elements, first go to this directory to find whether they have been implemented or have similar implementations and only need to be extended.

The HTML files in the "Extraction and Stripping" directory and the HTML files in the "Page Development" directory need to be maintained synchronously.

Development output

Self-testing and joint debugging

Update, merge, resolve conflicts, and submit.

Comprehensive multi-device testing and compatibility testing of your own code.

If you find problems with the code written by others during the self-test, please provide timely feedback.

Submit for acceptance

When there is phased output, the page engineer will submit the page to the designer for effect acceptance.

The effect acceptance will mainly check the visual effect compliance (size, position, color, cutting, etc.).

If necessary, it can be submitted to an experienced front-end engineer or front-end technology team for code acceptance at the same time.

Code acceptance will mainly check compatibility, HTML specifications and CSS specifications.

Handover Instructions

After the acceptance is completed, notify and hand it over to the subsequent development engineers for template layer development and behavioral logic development. The page engineers need to explain the areas that may require their attention or the explanation of the code.

If your work needs to be handed over to others, you also need to clearly explain the overall architecture deployment and code explanation.

Summary sharing

The sharing content can include: architectural ideas, collaboration experience, experience using NEC, introduction to equipment features, new technology applications, research and demonstrations, problems encountered and solutions, etc.

Sharing objects are not limited to: interaction, visual, front-end and all interested people.

You can submit the technical demo in the summary to NEC, and we will publish it to the code base to help you accumulate these technologies and share them with others.

Change Maintenance

In principle, direct development changes are not allowed without requirement changes and design changes.

The reason for the change should be understood before making the change, and follow-up development engineers should be notified in a timely manner after the change.

If the version number of static resources is not updated automatically, you may need to update the version number manually.

Changes and maintenance use all the processes in this specification, that is, you may need to repeat some of the previous processes.